prettier setup in eslint done ,eslint cmd run & build also checked

eslint.config.ts

@@ -1,6 +1,9 @@
-import pluginVue from 'eslint-plugin-vue'
-import { defineConfigWithVueTs, vueTsConfigs } from '@vue/eslint-config-typescript'
-import skipFormatting from '@vue/eslint-config-prettier/skip-formatting'
+import pluginVue from "eslint-plugin-vue";
+import {
+  defineConfigWithVueTs,
+  vueTsConfigs,
+} from "@vue/eslint-config-typescript";
+import prettierConfig from "@vue/eslint-config-prettier";
 
 // To allow more languages other than `ts` in `.vue` files, uncomment the following lines:
 // import { configureVueProject } from '@vue/eslint-config-typescript'
@@ -9,17 +12,21 @@ import skipFormatting from '@vue/eslint-config-prettier/skip-formatting'
 
 export default defineConfigWithVueTs(
   {
-    name: 'app/files-to-lint',
-    files: ['**/*.{ts,mts,tsx,vue}'],
+    name: "app/files-to-lint",
+    files: ["**/*.{ts,mts,tsx,vue}"],
   },
 
   {
-    name: 'app/files-to-ignore',
+    name: "app/files-to-ignore",
     // todo: change or remove assets/js
-    ignores: ['src/assets/js', '**/dist/**', '**/dist-ssr/**', '**/coverage/**'],
+    ignores: [
+      "src/assets/js",
+      "**/dist/**", 
+      "**/dist-ssr/**",
+      "**/coverage/**"]
   },
 
-  pluginVue.configs['flat/essential'],
+  pluginVue.configs["flat/essential"],
   vueTsConfigs.recommended,
-  skipFormatting,
-)
+  prettierConfig,
+)

src/App.vue

@@ -1,9 +1,9 @@
 <script setup lang="ts">
-import { RouterView } from 'vue-router'
+import { RouterView } from "vue-router";
 
-document.body.setAttribute('data-pc-theme', 'light')
-document.body.setAttribute('data-pc-direction', 'ltr')
-document.body.setAttribute('data-pc-preset', 'preset-1')
+document.body.setAttribute("data-pc-theme", "light");
+document.body.setAttribute("data-pc-direction", "ltr");
+document.body.setAttribute("data-pc-preset", "preset-1");
 </script>
 
 <template>

src/components/shared/AuthLayout.vue

@@ -9,10 +9,10 @@
  */
 
 // third party
-import { BCard, BImg } from 'bootstrap-vue-next'
+import { BCard, BImg } from "bootstrap-vue-next";
 
 // assets
-import darkLight from '@/assets/images/logo-dark.svg'
+import darkLight from "@/assets/images/logo-dark.svg";
 </script>
 
 <template>

src/components/shared/BaseBreadcrumb.vue

@@ -11,23 +11,23 @@
  * @computed {BreadcrumbItem[]} computedBreadcrumbs - Ensures the Home link is always included before rendering the breadcrumb list.
  */
 
-import { computed } from 'vue'
+import { computed } from "vue";
 
 // third party
-import { BBreadcrumb, BRow, BCol } from 'bootstrap-vue-next'
-import { type BreadcrumbItem } from 'bootstrap-vue-next'
+import { BBreadcrumb, BRow, BCol } from "bootstrap-vue-next";
+import { type BreadcrumbItem } from "bootstrap-vue-next";
 
 // Define Props
 const props = defineProps<{
-  title: string
-  breadcrumbs: BreadcrumbItem[]
-}>()
+  title: string;
+  breadcrumbs: BreadcrumbItem[];
+}>();
 
 // Ensure Home link is always present
 const computedBreadcrumbs = computed<BreadcrumbItem[]>(() => [
-  { text: 'Home', to: '/' },
+  { text: "Home", to: "/" },
   ...props.breadcrumbs,
-])
+]);
 </script>
 
 <template>

src/components/shared/BorderStyleCard.vue

@@ -10,7 +10,7 @@
 
 const props = defineProps({
   title: String,
-})
+});
 </script>
 
 <template>

src/components/shared/CardHeader.vue

@@ -10,12 +10,12 @@
  */
 
 // third party
-import { BCard } from 'bootstrap-vue-next'
+import { BCard } from "bootstrap-vue-next";
 
 const props = defineProps({
   title: String,
   caption: String,
-})
+});
 </script>
 
 <template>

src/components/shared/CardHeaderFooter.vue

@@ -11,12 +11,12 @@
  */
 
 // third party
-import { BCard } from 'bootstrap-vue-next'
+import { BCard } from "bootstrap-vue-next";
 
 const props = defineProps({
   title: String,
   caption: String,
-})
+});
 </script>
 
 <template>

src/components/shared/ComponentContent.vue

@@ -10,13 +10,13 @@
  */
 
 // third party
-import { BRow, BCol, BButton } from 'bootstrap-vue-next'
+import { BRow, BCol, BButton } from "bootstrap-vue-next";
 
 // Define Props with default values
 const props = defineProps({
   content: String,
   link: String,
-})
+});
 </script>
 
 <template>

src/components/shared/SvgSprite.vue

@@ -10,22 +10,23 @@
  *
  */
 
-import { ref, onMounted } from 'vue'
+import { ref, onMounted } from "vue";
 
 const props = defineProps({
   name: String,
-})
+});
 
-const spritePath = ref<string | null>(null)
+const spritePath = ref<string | null>(null);
 
 onMounted(async () => {
   try {
     // Load the SVG sprite dynamically with an absolute path
-    spritePath.value = (await import.meta.env.BASE_URL) + 'assets/svg/sprite.svg'
+    spritePath.value =
+      (await import.meta.env.BASE_URL) + "assets/svg/sprite.svg";
   } catch (error) {
-    console.error('Error loading SVG sprite:', error)
+    console.error("Error loading SVG sprite:", error);
   }
-})
+});
 </script>
 
 <template>

src/config.ts

@@ -1,9 +1,9 @@
 export type ConfigProps = {
-  sidebarCollapse: boolean
-}
+  sidebarCollapse: boolean;
+};
 
 const config: ConfigProps = {
   sidebarCollapse: true,
-}
+};
 
-export default config
+export default config;

src/layouts/LoaderWrapper.vue

@@ -1,11 +1,11 @@
 <script setup lang="ts">
-import { storeToRefs } from 'pinia'
+import { storeToRefs } from "pinia";
 
 // files
-import { useUIStore } from '@/stores/ui'
+import { useUIStore } from "@/stores/ui";
 
-const uiStore = useUIStore()
-const { isLoading } = storeToRefs(uiStore)
+const uiStore = useUIStore();
+const { isLoading } = storeToRefs(uiStore);
 </script>
 
 <template>

src/layouts/blank/BlankLayout.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
-import { RouterView } from 'vue-router'
+import { RouterView } from "vue-router";
 
 // components
-import LoaderWrapper from '../LoaderWrapper.vue'
+import LoaderWrapper from "../LoaderWrapper.vue";
 </script>
 
 <template>

src/layouts/dashboard/DashboardLayout.vue

@@ -1,11 +1,11 @@
 <script setup lang="ts">
-import { RouterView } from 'vue-router'
+import { RouterView } from "vue-router";
 
 // components
-import VerticalSidebar from './vertical-sidebar/VerticalSidebar.vue'
-import VerticalHeader from './vertical-header/VerticalHeader.vue'
-import Footer from './FooterBlock.vue'
-import LoaderWrapper from '../LoaderWrapper.vue'
+import VerticalSidebar from "./vertical-sidebar/VerticalSidebar.vue";
+import VerticalHeader from "./vertical-header/VerticalHeader.vue";
+import Footer from "./FooterBlock.vue";
+import LoaderWrapper from "../LoaderWrapper.vue";
 </script>
 
 <template>

src/layouts/dashboard/FooterBlock.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 // third party
-import { BContainer, BRow, BCol } from 'bootstrap-vue-next'
+import { BContainer, BRow, BCol } from "bootstrap-vue-next";
 </script>
 
 <template>
@@ -10,19 +10,31 @@ import { BContainer, BRow, BCol } from 'bootstrap-vue-next'
         <BCol cols="auto" class="footer-title my-1">
           <p class="m-0">
             Datta able &#9829; crafted by Team
-            <a href="https://codedthemes.com/" class="text-primary" target="_blank">CodedThemes</a>
+            <a
+              href="https://codedthemes.com/"
+              class="text-primary"
+              target="_blank"
+              >CodedThemes</a
+            >
           </p>
         </BCol>
         <BCol cols="auto" class="my-1">
           <ul class="list-inline footer-link mb-0">
-            <li class="list-inline-item"><router-link to="/">Home</router-link></li>
             <li class="list-inline-item">
-              <a href="https://codedthemes.gitbook.io/datta/datta-able-vue" target="_blank">
+              <router-link to="/">Home</router-link>
+            </li>
+            <li class="list-inline-item">
+              <a
+                href="https://codedthemes.gitbook.io/datta/datta-able-vue"
+                target="_blank"
+              >
                 Documentation
               </a>
             </li>
             <li class="list-inline-item">
-              <a href="https://codedthemes.support-hub.io/" target="_blank"> Support </a>
+              <a href="https://codedthemes.support-hub.io/" target="_blank">
+                Support
+              </a>
             </li>
           </ul>
         </BCol>

src/layouts/dashboard/logo/LogoMain.vue

@@ -1,12 +1,16 @@
 <script setup lang="ts">
-import { RouterLink } from 'vue-router'
+import { RouterLink } from "vue-router";
 </script>
 
 <template>
   <div class="m-header">
     <RouterLink to="/" class="b-brand text-primary" aria-label="logo">
       <!-- ========   Change your logo from here   ============ -->
-      <img src="@/assets/images/logo-white.svg" class="img-fluid logo-lg" alt="logo" />
+      <img
+        src="@/assets/images/logo-white.svg"
+        class="img-fluid logo-lg"
+        alt="logo"
+      />
     </RouterLink>
   </div>
 </template>