Initial setup for migrating to latest eslint and updated to latest eslint config format.

.eslintrc.js

@@ -1,59 +0,0 @@
-module.exports = {
-    env: {
-        browser: true,
-        jest: true
-    },
-    parserOptions: {
-        ecmaVersion: 'latest'
-    },
-    extends: [
-        'eslint-config-airbnb-base',
-        'plugin:vue/vue3-recommended',
-        'plugin:jsdoc/recommended'
-    ],
-    rules: {
-        'linebreak-style': 'off',
-        'vue/component-definition-name-casing': ['warn', 'kebab-case'],
-        'vue/require-default-prop': 'off',
-        'vue/attribute-hyphenation': ['warn', 'never'],
-        'vue/v-on-event-hyphenation': ['warn', 'never'],
-        'object-curly-newline': ['error', { consistent: true }],
-        'function-paren-newline': ['error', 'multiline'],
-        'operator-linebreak': ['error', 'before', { overrides: { '=': 'after' } }],
-        'implicit-arrow-linebreak': ['off'],
-        'comma-dangle': ['error', 'never'],
-        indent: ['error', 4, { SwitchCase: 1 }],
-        'max-len': ['error', { code: 160 }],
-        'no-plusplus': ['error', { allowForLoopAfterthoughts: true }],
-        'vue/html-indent': 'off',
-        'vue/html-closing-bracket-newline': ['error', {
-            singleline: 'never',
-            multiline: 'never'
-        }],
-        'jsdoc/check-tag-names': ['error', {
-            definedTags: ['store', 'endpoint', 'category', 'subcategory', 'remarks']
-        }],
-        'jsdoc/require-jsdoc': 0,
-        'vue/html-self-closing': ['error', {
-            html: {
-                void: 'any',
-                normal: 'any',
-                component: 'any'
-            },
-            svg: 'always',
-            math: 'always'
-        }],
-        'import/extensions': ['error', 'always', { js: 'ignorePackages' }],
-        'no-param-reassign': ['error', { props: true, ignorePropertyModificationsFor: ['item'] }],
-        'no-restricted-syntax': ['off', 'ForOfStatement'],
-        'no-return-await': 'off'
-    },
-    settings: {
-        'import/resolver': {
-            alias: {
-                map: [['@', './src/']],
-                extensions: ['.js', '.vue']
-            }
-        }
-    }
-};

eslint.config.js

@@ -0,0 +1,143 @@
+import { globalIgnores } from 'eslint/config';
+import { defineConfigWithVueTs, vueTsConfigs } from '@vue/eslint-config-typescript';
+import pluginVue from 'eslint-plugin-vue';
+//import pluginVitest from '@vitest/eslint-plugin';
+import js from '@eslint/js';
+import globals from 'globals';
+import stylistic from '@stylistic/eslint-plugin';
+import jsdoc from 'eslint-plugin-jsdoc';
+
+export default defineConfigWithVueTs(
+    {
+        name: 'app/files-to-lint',
+        files: ['**/*.{vue,ts,js,mts,tsx}'],
+    },
+
+    js.configs.recommended,
+    jsdoc.configs['flat/recommended-mixed'],
+
+    // Add @stylistic configuration
+    stylistic.configs.customize({
+        indent: 4,
+        quotes: 'single',
+        semi: true,
+        // Add any other stylistic preferences here
+    }),
+
+    ...pluginVue.configs['flat/essential'],
+    vueTsConfigs.recommended,
+    {
+        name: 'app/global-rules',
+        files: ['**/*.{js,ts,vue}'],
+        rules: {
+            'eqeqeq': ['error', 'smart'],
+            'no-nested-ternary': 'error',
+            'no-param-reassign': 'error',
+            'jsdoc/require-jsdoc': 'off',
+            '@stylistic/comma-dangle': 'off',
+            '@stylistic/max-len': ['error', {
+                code: 160,
+                tabWidth: 4,
+                ignoreUrls: true,
+                ignoreStrings: true,
+                ignoreTemplateLiterals: true
+            }],
+
+            'vue/max-len': ['error', {
+                code: 160,
+                template: 160,
+                tabWidth: 4,
+                ignoreUrls: true,
+                ignoreStrings: true,
+                ignoreTemplateLiterals: true,
+                ignoreHTMLTextContents: false
+            }],
+        }
+    },
+
+    {
+        name: 'app/custom-vue-rules',
+        files: ['**/*.vue'],
+        rules: {
+            'vue/block-lang': ['error', {
+                script: {
+                    lang: ['js', 'ts'],
+                    allowNoLang: true // Still allow <script> without a lang tag
+                },
+                style: {
+                    lang: 'scss',
+                    allowNoLang: false // Disallow <style> without lang="scss"
+                }
+            }]
+        }
+    },
+
+    {
+        name: 'app/custom-js-rules',
+        files: ['**/*.{js,ts}'],
+        languageOptions: {
+            globals: {
+                ...globals.browser,
+                ...globals.node,
+                ...globals.vitest,
+                ...globals.vue
+            }
+        }
+    },
+
+    // Additional test globals (object) — applies only to test files
+    // {
+    //     files: ['**/*.spec.*', '**/*.test.*', '**/unit-test-helper.js'],
+    //     ...pluginVitest.configs.recommended,
+    // },
+
+    {
+        name: 'app/temp-rules',
+        rules: {
+            // Temp rules until we make a pass at fixing all of them.
+            '@stylistic/arrow-parens': 'off',
+            '@stylistic/brace-style': 'off',
+            '@stylistic/eol-last': 'off',
+            '@stylistic/indent': 'off',
+            '@stylistic/indent-binary-ops': 'off',
+            '@stylistic/max-len': 'off',
+            '@stylistic/max-statements-per-line': 'off',
+            '@stylistic/multiline-ternary': 'off',
+            '@stylistic/no-trailing-spaces': 'off',
+            '@stylistic/object-curly-spacing': 'off',
+            '@stylistic/operator-linebreak': 'off',
+            '@stylistic/quote-props': 'off',
+            '@stylistic/quotes': 'off',
+            '@stylistic/semi': 'off',
+            '@typescript-eslint/no-unused-expressions': 'off',
+            '@typescript-eslint/no-unused-vars': 'off',
+            'jsdoc/reject-any-type': 'off',
+            'jsdoc/require-param-description': 'off',
+            'jsdoc/require-returns-type': 'off',
+            'jsdoc/ts-no-empty-object-type': 'off',
+            'no-constant-binary-expression': 'off',
+            'no-dupe-keys': 'off',
+            'no-import-assign': 'off',
+            'no-shadow': 'off',
+            'vitest/no-conditional-expect': 'off',
+            'vitest/no-identical-title': 'off',
+            'vitest/valid-expect': 'off',
+            'vitest/valid-expect-in-promise': 'off',
+            'vitest/valid-title': 'off',
+            'vue/max-len': 'off',
+            'vue/multi-word-component-names': 'off',
+            'vue/no-side-effects-in-computed-properties': 'off',
+            '@typescript-eslint/no-require-imports': 'off',
+            'vitest/no-commented-out-tests': 'off',
+            'vitest/no-focused-tests': 'off',
+            'no-undef': 'off',
+            'vue/require-toggle-inside-transition': 'off',
+            'vue/no-dupe-keys': 'off',
+            '@typescript-eslint/no-this-alias': 'off',
+            'vitest/expect-expect': 'off',
+            'no-param-reassign': 'off',
+        }
+    },
+
+    globalIgnores(['**/dist/**', '**/dist-ssr/**', '**/coverage/**', 'playwright-tests', '**/*.snap']),
+);

package.json

@@ -14,7 +14,9 @@
     "test:unit": "vue-cli-service test:unit --coverage --ci --colors",
     "test:unit:coverage": "vue-cli-service test:unit --coverage --ci --colors",
     "test:unit:lite": "vue-cli-service test:unit --ci",
-    "test:playwright": "playwright test --config=playwright-tests/playwright.config.ts"
+    "test:playwright": "playwright test --config=playwright-tests/playwright.config.ts",
+    "lint": "eslint --quiet .",
+    "lint:inspect": "eslint --inspect-config"
   },
   "dependencies": {
     "axios": "^1.13.5",
@@ -31,11 +33,13 @@
     "vue-router": "4.2.4"
   },
   "devDependencies": {
+    "@eslint/js": "^9.39.2",
     "@faker-js/faker": "^9.0.3",
     "@pinia/testing": "0.1.2",
     "@playwright/test": "^1.56.1",
     "@rushstack/eslint-patch": "^1.3.2",
     "@saucelabs/playwright-reporter": "^1.5.0",
+    "@stylistic/eslint-plugin": "^5.6.1",
     "@testing-library/jest-dom": "5.16.5",
     "@testing-library/user-event": "14.4.3",
     "@testing-library/vue": "6.6.1",
@@ -48,6 +52,8 @@
     "@vue/cli-plugin-router": "~5.0.0",
     "@vue/cli-plugin-unit-jest": "~5.0.0",
     "@vue/cli-service": "~5.0.0",
+    "@vue/eslint-config-prettier": "^10.2.0",
+    "@vue/eslint-config-typescript": "^14.6.0",
     "@vue/test-utils": "^2.4.1",
     "@vue/vue3-jest": "^27.0.0-alpha.1",
     "axe-core": "^4.10.2",
@@ -57,8 +63,11 @@
     "concurrently": "^9.1.2",
     "dotenv-safe": "^9.1.0",
     "eslint": "^9.39.2",
-    "eslint-plugin-vue": "^9.15.1",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-jsdoc": "^61.5.0",
+    "eslint-plugin-vue": "^10.6.2",
     "form-data": "^4.0.4",
+    "globals": "^17.0.0",
     "jest": "^27.0.5",
     "jest-junit": "^13.0.0",
     "jest-serializer-vue": "^3.1.0",
@@ -66,13 +75,14 @@
     "jsdom": "^22.1.0",
     "luxon": "^3.5.0",
     "ortoni-report": "^2.0.8",
+    "prettier": "^3.7.4",
     "sass": "^1.77.8",
     "sass-loader": "^12.0.0",
     "saucectl": "^0.188.0",
     "typescript-eslint": "^8.11.0",
     "vite": "^6.4.1",
     "vitest": "^3.2.4",
-    "volar-service-vetur": "latest",
+    "vue-eslint-parser": "^10.2.0",
     "wait-on": "^8.0.2"
   }
 }