feat: use recommended vue-linting

.eslintrc.cjs

@@ -1,5 +1,5 @@
 /* eslint-env node */
-require("@rushstack/eslint-patch/modern-module-resolution")
+require('@rushstack/eslint-patch/modern-module-resolution')
 
 module.exports = {
 	'root': true,
@@ -7,52 +7,53 @@ module.exports = {
 		'browser': true,
 		'es2022': true,
 		'node': true,
-		'vue/setup-compiler-macros': true,
 	},
 	'extends': [
 		'eslint:recommended',
-		'plugin:vue/vue3-essential',
+		'plugin:vue/vue3-recommended',
 		'@vue/eslint-config-typescript/recommended',
 	],
 	'rules': {
-		'vue/html-quotes': [
+		'quotes': ['error', 'single'],
-			'error',
+		'comma-dangle': ['error', 'always-multiline'],
-			'double',
+		'semi': ['error', 'never'],
-		],
-		'quotes': [
-			'error',
-			'single',
-		],
-		'comma-dangle': [
-			'error',
-			'always-multiline',
-		],
-		'semi': [
-			'error',
-			'never',
-		],
 
-		// see https://segmentfault.com/q/1010000040813116/a-1020000041134455 (original in chinese)
+		'vue/v-on-event-hyphenation': ['warn', 'never', { 'autofix': true }],
-		'no-unused-vars': 'off',
+		'vue/multi-word-component-names': 'warn',
-		'@typescript-eslint/no-unused-vars': ['error', { vars: 'all', args: 'after-used', ignoreRestSiblings: true }],
 
-		'vue/multi-word-component-names': 0,
+		// uncategorized rules:
-		// disabled until we have support for reactivityTransform
+		'vue/component-api-style': ['error', ['script-setup']],
-		// See https://github.com/vuejs/eslint-plugin-vue/issues/1948
+		'vue/component-name-in-template-casing': ['warn', 'PascalCase'],
-		// see also setting in `vite.config`
+		'vue/custom-event-name-casing': ['error', 'camelCase'],
-		'vue/no-setup-props-destructure': 0,
+		'vue/define-macros-order': 'error',
+		'vue/match-component-file-name': ['error', {
+			'extensions': ['.js', '.jsx', '.ts', '.tsx', '.vue'],
+			'shouldMatchCase': true,
+		}],
+		'vue/no-boolean-default': ['warn', 'default-false'],
+		'vue/match-component-import-name': 'error',
+		'vue/prefer-separate-static-class': 'warn',
+
+		'vue/padding-line-between-blocks': 'error',
+		'vue/next-tick-style': ['error', 'promise'],
+		'vue/block-lang': [
+			'error',
+			{ 'script': { 'lang': 'ts' } },
+		],
+		'vue/no-required-prop-with-default': ['error', { 'autofix': true }],
+		'vue/no-duplicate-attr-inheritance': 'error',
+		'vue/no-empty-component-block': 'error',
+
+		// vue3
+		'vue/no-ref-object-destructure': 'error',
 	},
 	'parser': 'vue-eslint-parser',
 	'parserOptions': {
 		'parser': '@typescript-eslint/parser',
-		'ecmaVersion': 2022,
+		'ecmaVersion': 'latest',
-		'sourceType': 'module',
 	},
 	'ignorePatterns': [
 		'*.test.*',
 		'cypress/*',
 	],
-	'globals': {
-		'defineProps': 'readonly',
-	},
 }

eslint.config_bac.js

@@ -0,0 +1,122 @@
+// import originalEslintPluginVue from 'eslint-plugin-vue'
+import vueTsRecommended from '@vue/eslint-config-typescript/recommended.js'
+// import vueParser from 'vue-eslint-parser'
+import tsParser from "@typescript-eslint/parser"
+
+const vue3Recommended = vue.configs['vue3-recommended']
+
+import {default as originalVuePlugin} from "eslint-plugin-vue";
+
+// see https://github.com/eslint/eslint/issues/16875#issuecomment-1426594123
+const eslintPluginVue = {
+	...originalVuePlugin,
+	parsers: {
+  	'parser': {
+			parseForESLint: originalVuePlugin.parseForESLint
+		}
+	}
+}
+
+// export default [{
+//   files:   ["**/*.json", "**/*.jsonc", "**/*.json5"],
+//   plugins: {
+//     vue: { ...vue, parsers}
+//     /* same as
+//     jsonc: {
+//       parsers: {
+//         'jsonc-eslint-parser': {
+//           parseForESLint
+//         }
+//       }
+//     } */
+//   },
+//   languageOptions: {
+//      parser: 'vue/vue-eslint-parser'
+//   },
+//   rules: {...}
+// }];
+
+export default [
+	// 'eslint:recommended',
+	{
+		files:   ["**/*.vue"],
+		plugins: {
+			vue: eslintPluginVue,
+		},
+		languageOptions: {
+			parser: 'vue/parser'
+	 },
+	},
+	// {
+	// 	plugins: {
+	// 		// vue: vue3Recommended,
+	// 		// '@typescript-eslint': vueTsRecommended,
+	// 	},
+	// 	languageOptions: {
+	// 		// parser: eslintPluginVue,
+	// 		// parser: 'vue/vue-eslint-parser',
+	// 		parserOptions: {
+	// 			parser: '@typescript-eslint/parser',
+	// 			// 'ecmaVersion': 2022,
+	// 			// 'sourceType': 'module',
+	// 		},
+	// 	}
+	// }
+	// {
+	// 	files: ["./src/**/*.vue"],
+	// 	// files: ["./src/**/*.js"],
+	// 	// ignores: ["**/*.config.js"],
+	// 	rules: {
+	// 			semi: "error"
+	// 	},
+	// 	plugins: {
+	// 		vue: vue3Recommended,
+	// 		// '@typescript-eslint': vueTsRecommended,
+	// 	},
+	// },
+	// {
+	// 	files: ["src/**/*.vue"],
+	// 	// files: [
+	// 	// 	'src/**/*.vue',
+	// 	// 	'src/**/*.js',
+	// 	// 	'src/**/*.ts',
+	// 	// 	// 'src/**/*.+(vue|js|ts)',
+	// 	// ],
+	// 	ignores: [
+	// 		'*.test.*',
+	// 		'cypress/*',
+	// 	],
+	// 	plugins: {
+	// 		vue: vue3Recommended,
+	// 		'@typescript-eslint': vueTsRecommended,
+	// 	},
+	// 	rules: {
+	// 		'vue/html-quotes': ['error', 'double'],
+	// 		'quotes': ['error', 'single'],
+	// 		'comma-dangle': ['error', 'always-multiline'],
+	// 		'semi': ['error', 'never'],
+	// 		'vue/multi-word-component-names': 0,
+	// 		// disabled until we have support for reactivityTransform
+	// 		// See https://github.com/vuejs/eslint-plugin-vue/issues/1948
+	// 		// see also setting in `vite.config`
+	// 		'vue/no-setup-props-destructure': 0,
+	// 	},
+	// 	// overwrite the following with correct values
+	// 	// eslint-plugin-vue/lib/configs/base.js
+
+	// 	// parser: 
+	// 	parserOptions: {
+	// 		ecmaVersion: 2022,
+
+
+	// 		'parser': '@typescript-eslint/parser',
+	// 		'sourceType': 'module',
+	// 	},
+	// 	globals: {
+	// 		'browser': true,
+	// 		'es2022': true,
+	// 		'node': true,
+	// 		'vue/setup-compiler-macros': true,
+	// 	}
+	// },
+]

package.json

@@ -22,6 +22,7 @@
     "gantt",
     "kanban"
   ],
+  "type": "module",
   "scripts": {
     "serve": "vite",
     "preview": "vite preview --port 4173",
@@ -29,7 +30,8 @@
     "build": "vite build && workbox copyLibraries dist/",
     "build:modern-only": "BUILD_MODERN_ONLY=true vite build && workbox copyLibraries dist/",
     "build:dev": "vite build --mode development --outDir dist-dev/",
-    "lint": "eslint --ignore-pattern '*.test.*' ./src --ext .vue,.js,.ts",
+    "lint": "eslint 'src/**/*.{js,ts,vue}'",
+    "lint:fix": "eslint --fix 'src/**/*.{js,ts,vue}' ",
     "test:e2e": "start-server-and-test preview http://127.0.0.1:4173 'cypress run --e2e --browser chrome'",
     "test:e2e-record": "start-server-and-test preview http://127.0.0.1:4173 'cypress run --e2e --browser chrome --record'",
     "test:e2e-dev-dev": "start-server-and-test preview:dev http://127.0.0.1:4173 'cypress open --e2e'",