Merge pull request #429 from cattr-app/chore/333-frontend-deps

chore(deps): upgrade framework-neutral frontend dependencies and move ESLint to flat config

Author: vermorag

.eslintignore

@@ -495,7 +495,7 @@ pnpm lint
 
 Frontend formatting is defined by `prettier.config.js`.
 
-ESLint configuration is defined by `.eslintrc.js`.
+ESLint configuration is defined by `eslint.config.js` (ESLint flat config).
 
 The frontend currently uses Vue 2.7, Vue Router 3, Vuex 3, Laravel Mix, and Webpack 5.
 

.eslintrc.js

@@ -0,0 +1,54 @@
+const js = require('@eslint/js');
+const globals = require('globals');
+const pluginVue = require('eslint-plugin-vue');
+const prettierRecommended = require('eslint-plugin-prettier/recommended');
+
+module.exports = [
+    {
+        ignores: ['resources/frontend/generated/**'],
+    },
+    {
+        files: ['**/*.js', '**/*.vue'],
+    },
+    ...pluginVue.configs['flat/vue2-essential'],
+    js.configs.recommended,
+    prettierRecommended,
+    {
+        languageOptions: {
+            ecmaVersion: 'latest',
+            sourceType: 'module',
+            globals: {
+                ...globals.node,
+                ...globals.browser,
+            },
+        },
+        rules: {
+            'linebreak-style': ['error', 'unix'],
+            'prettier/prettier': 'error',
+            'no-console': 'off',
+            'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+            'no-unused-vars': 'off',
+            // Added to eslint:recommended in ESLint 9; kept off to preserve the ESLint 8 rule set.
+            'no-useless-assignment': 'off',
+            'vue/multi-word-component-names': 'off',
+            'vue/attributes-order': [
+                'error',
+                {
+                    order: [
+                        'DEFINITION',
+                        'LIST_RENDERING',
+                        'CONDITIONALS',
+                        'RENDER_MODIFIERS',
+                        'GLOBAL',
+                        'UNIQUE',
+                        'TWO_WAY_BINDING',
+                        'OTHER_DIRECTIVES',
+                        'OTHER_ATTR',
+                        'EVENTS',
+                        'CONTENT',
+                    ],
+                },
+            ],
+        },
+    },
+];

CONTRIBUTING.md

@@ -14,7 +14,7 @@
         "watch": "mix watch",
         "hot": "mix watch --hot",
         "prod": "mix --production",
-        "lint": "eslint --ext .js,.vue -c .eslintrc.js resources/frontend/",
+        "lint": "eslint resources/frontend/",
         "test": "node --test tests/js/*.test.cjs",
         "test:e2e": "playwright test",
         "test:e2e:update": "playwright test --project=visual-desktop --project=visual-mobile --update-snapshots=changed",
@@ -23,30 +23,30 @@
     },
     "dependencies": {
         "@amazingcat/cattr-ui": "^1.3.14",
-        "@svgdotjs/svg.js": "^3.2.0",
+        "@svgdotjs/svg.js": "^3.2.8",
         "apidoc": "0.29.0",
-        "axios": "^1.18.5",
+        "axios": "^1.20.0",
         "caret-pos": "^2.0.0",
-        "chart.js": "^4.3.3",
-        "color-convert": "^2.0.1",
-        "echarts": "^5.4.3",
+        "chart.js": "^4.6.1",
+        "color-convert": "^3.1.3",
+        "echarts": "^5.6.0",
         "events": "3.3.0",
-        "highlight.js": "11.10.0",
-        "js-md5": "^0.8.3",
-        "laravel-echo": "^1.16.1",
-        "lodash": "^4.18.0",
-        "markdown-it": "^14.2.0",
-        "markdown-it-highlightjs": "^4.1.0",
+        "highlight.js": "11.12.0",
+        "js-md5": "^0.9.2",
+        "laravel-echo": "^2.6.1",
+        "lodash": "^4.18.1",
+        "markdown-it": "^14.3.3",
+        "markdown-it-highlightjs": "^4.3.0",
         "markdown-it-sub": "^2.0.0",
         "markdown-it-sup": "^2.0.0",
         "moment": "2.31.0",
-        "moment-timezone": "^0.5.45",
+        "moment-timezone": "^0.6.5",
         "path-browserify": "^1.0.1",
-        "pusher-js": "^8.4.0-rc2",
+        "pusher-js": "^8.6.0",
         "quill": "1.3.7",
-        "semver": "^7.6.0",
+        "semver": "^7.8.5",
         "v-code-diff": "^1.13.1",
-        "validator": "^13.15.22",
+        "validator": "^13.15.35",
         "vee-validate": "^3.4.15",
         "vue": "^2.7.16",
         "vue-avatar": "^2.3.3",
@@ -67,15 +67,16 @@
     },
     "devDependencies": {
         "@babel/core": "^7.23.7",
-        "@babel/eslint-parser": "^7.23.9",
+        "@eslint/js": "^10.0.1",
         "@playwright/test": "1.64.1",
-        "autoprefixer": "^10.4.16",
+        "autoprefixer": "^10.6.1",
         "clean-webpack-plugin": "^4.0.0",
         "core-js": "^3.35.0",
-        "eslint": "^8.56.0",
+        "eslint": "^10.13.0",
         "eslint-config-prettier": "^10.1.8",
-        "eslint-plugin-prettier": "^5.1.3",
-        "eslint-plugin-vue": "^9.20.1",
+        "eslint-plugin-prettier": "^5.5.7",
+        "eslint-plugin-vue": "^10.12.0",
+        "globals": "^17.13.0",
         "laravel-mix": "^6.0.49",
         "laravel-mix-bundle-analyzer": "^1.0.5",
         "laravel-mix-clean": "^0.1.0",
@@ -84,14 +85,14 @@
         "laravel-mix-serve": "^2.2.2",
         "laravel-mix-sri": "^1.3.0",
         "laravel-mix-workbox": "^0.1.4",
-        "postcss": "^8.4.31",
-        "prettier": "3.2.5",
+        "postcss": "^8.5.31",
+        "prettier": "3.9.10",
         "process": "0.11.10",
         "resolve-url-loader": "^5.0.0",
         "sass": "^1.70.0",
         "sass-loader": "^13.3.3",
         "sass-resources-loader": "^2.2.5",
-        "vue-eslint-parser": "^9.4.2",
+        "vue-eslint-parser": "^10.4.1",
         "vue-loader": "^15.11.1",
         "webpack": "^5.91.0",
         "workbox-webpack-plugin": "^7.4.1"