chore: switch to eslint flat config

Author: sxzz

.eslintignore

@@ -0,0 +1,53 @@
+import eslint from '@eslint/js'
+import tseslint from 'typescript-eslint'
+import pluginVue from 'eslint-plugin-vue'
+
+export default tseslint.config(
+  { ignores: ['**/node_modules', '**/dist'] },
+  eslint.configs.recommended,
+  tseslint.configs.base,
+  ...pluginVue.configs['flat/recommended'],
+  {
+    files: ['**/*.vue'],
+    languageOptions: {
+      parserOptions: {
+        parser: '@typescript-eslint/parser',
+      },
+    },
+  },
+  {
+    rules: {
+      'no-debugger': 'error',
+      'no-console': ['error', { allow: ['warn', 'error', 'info', 'clear'] }],
+      'no-unused-vars': 'off',
+      'no-undef': 'off',
+      'prefer-const': 'error',
+      'sort-imports': ['error', { ignoreDeclarationSort: true }],
+      'no-duplicate-imports': 'error',
+      // This rule enforces the preference for using '@ts-expect-error' comments in TypeScript
+      // code to indicate intentional type errors, improving code clarity and maintainability.
+      '@typescript-eslint/prefer-ts-expect-error': 'error',
+      // Enforce the use of 'import type' for importing types
+      '@typescript-eslint/consistent-type-imports': [
+        'error',
+        {
+          fixStyle: 'inline-type-imports',
+          disallowTypeAnnotations: false,
+        },
+      ],
+      // Enforce the use of top-level import type qualifier when an import only has specifiers with inline type qualifiers
+      '@typescript-eslint/no-import-type-side-effects': 'error',
+      'vue/max-attributes-per-line': 'off',
+      'vue/singleline-html-element-content-newline': 'off',
+      'vue/multi-word-component-names': 'off',
+      'vue/html-self-closing': [
+        'error',
+        {
+          html: { component: 'always', normal: 'always', void: 'any' },
+          math: 'always',
+          svg: 'always',
+        },
+      ],
+    },
+  },
+)

.eslintrc.cjs

@@ -46,7 +46,7 @@
     "build": "vite build",
     "build-preview": "vite build -c vite.preview.config.ts",
     "format": "prettier --write .",
-    "lint": "eslint --ext .ts,.vue .",
+    "lint": "eslint .",
     "typecheck": "vue-tsc --noEmit",
     "release": "bumpp --all",
     "version": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0",
@@ -73,13 +73,13 @@
   "devDependencies": {
     "@babel/standalone": "^7.24.7",
     "@babel/types": "^7.24.7",
+    "@eslint/js": "^9.6.0",
     "@rollup/plugin-replace": "^5.0.7",
     "@shikijs/monaco": "^1.10.0",
     "@types/babel__standalone": "^7.1.7",
     "@types/codemirror": "^5.60.15",
     "@types/hash-sum": "^1.0.2",
     "@types/node": "^20.14.9",
-    "@typescript-eslint/eslint-plugin": "^7.15.0",
     "@vitejs/plugin-vue": "^5.0.5",
     "@volar/jsdelivr": "~2.4.0-alpha.12",
     "@volar/monaco": "~2.4.0-alpha.12",
@@ -90,7 +90,7 @@
     "codemirror": "^5.65.16",
     "conventional-changelog-cli": "^5.0.0",
     "eslint": "^9.6.0",
-    "eslint-plugin-vue": "^9.26.0",
+    "eslint-plugin-vue": "^9.27.0",
     "fflate": "^0.8.2",
     "hash-sum": "^2.0.0",
     "lint-staged": "^15.2.7",
@@ -100,6 +100,7 @@
     "simple-git-hooks": "^2.11.1",
     "sucrase": "^3.35.0",
     "typescript": "^5.5.3",
+    "typescript-eslint": "^7.15.0",
     "vite": "^5.3.2",
     "vite-plugin-dts": "^3.9.1",
     "vscode-uri": "^3.0.8",

eslint.config.js

@@ -91,7 +91,7 @@ function changeViewSize() {
       class="right"
       :style="{ [isVertical ? 'height' : 'width']: 100 - boundSplit + '%' }"
     >
-      <div class="view-size" v-show="state.dragging">
+      <div v-show="state.dragging" class="view-size">
         {{ `${state.viewWidth}px x ${state.viewHeight}px` }}
       </div>
       <slot name="right" />