adapt our former eslint v8 configuration to v9

- replace eslint-plugin-import by v9 compatible eslint-plugin-import-x
- update eslint configuration in app/
- add eslint v9 configuration in lib/
- add rule to detect unused disable directives
- adapt eslint scripts in package.json files regarding deprecated --ext parameter
- update the global package-lock.json file
This commit is contained in:
mahula 2025-12-03 14:59:50 +01:00
parent 97a9bd7775
commit 7dd37ae982
6 changed files with 4749 additions and 1534 deletions

View File

@ -1,9 +1,10 @@
// ESLint v9 flat config for Utopia Map App
import js from '@eslint/js'
import eslintCommentsPlugin from '@eslint-community/eslint-plugin-eslint-comments'
import importPlugin from 'eslint-plugin-import'
import eslintCommentsConfigs from '@eslint-community/eslint-plugin-eslint-comments/configs'
import importXPlugin from 'eslint-plugin-import-x'
import jsonPlugin from 'eslint-plugin-json'
import noCatchAllPlugin from 'eslint-plugin-no-catch-all'
import eslintPluginPrettierRecommended from 'eslint-plugin-prettier/recommended'
import promisePlugin from 'eslint-plugin-promise'
import react from 'eslint-plugin-react'
import reactHooks from 'eslint-plugin-react-hooks'
@ -18,12 +19,29 @@ export default tseslint.config(
ignores: ['dist/**', 'node_modules/**', 'data/**', 'vite.config.ts'],
},
// Report unused eslint-disable directives (catches stale comments after rule renames)
{
linterOptions: {
reportUnusedDisableDirectives: 'error',
},
},
// Base ESLint recommended config
js.configs.recommended,
// ESLint comments recommended config
eslintCommentsConfigs.recommended,
// Security recommended config
securityPlugin.configs.recommended,
// React recommended configs
react.configs.flat.recommended,
react.configs.flat['jsx-runtime'],
// Main configuration for JavaScript/TypeScript files
{
files: ['**/*.{js,jsx,ts,tsx}'],
files: ['**/*.{js,jsx,ts,tsx,cjs,mjs}'],
languageOptions: {
ecmaVersion: 'latest',
sourceType: 'module',
@ -41,17 +59,15 @@ export default tseslint.config(
'react': react,
'react-hooks': reactHooks,
'react-refresh': reactRefresh,
'import': importPlugin,
'import-x': importXPlugin,
'promise': promisePlugin,
'security': securityPlugin,
'no-catch-all': noCatchAllPlugin,
'@eslint-community/eslint-comments': eslintCommentsPlugin,
},
settings: {
react: {
version: '18.2.0',
},
'import/resolver': {
'import-x/resolver': {
typescript: true,
node: {
extensions: ['.js', '.jsx', '.ts', '.tsx'],
@ -95,41 +111,41 @@ export default tseslint.config(
'react-refresh/only-export-components': ['warn', { allowConstantExport: true }],
// Import rules
'import/export': 'error',
'import/no-deprecated': 'error',
'import/no-empty-named-blocks': 'error',
'import/no-extraneous-dependencies': 'error',
'import/no-mutable-exports': 'error',
'import/no-named-as-default': 'error',
'import/no-named-as-default-member': 'error',
'import/no-amd': 'error',
'import/no-commonjs': 'error',
'import/no-nodejs-modules': 'off',
'import/default': 'error',
'import/named': 'error',
'import/namespace': 'error',
'import/no-absolute-path': 'error',
'import/no-cycle': 'error',
'import/no-dynamic-require': 'error',
'import/no-internal-modules': 'off',
'import/no-relative-packages': 'error',
'import/no-self-import': 'error',
'import/no-unresolved': ['error', { ignore: ['react'] }],
'import/no-useless-path-segments': 'error',
'import/no-webpack-loader-syntax': 'error',
'import/consistent-type-specifier-style': 'error',
'import/exports-last': 'off',
'import/extensions': ['error', 'never', { json: 'always' }],
'import/first': 'error',
'import/group-exports': 'off',
'import/newline-after-import': 'error',
'import/no-anonymous-default-export': 'off',
'import/no-default-export': 'off',
'import/no-duplicates': 'error',
'import/no-named-default': 'error',
'import/no-namespace': 'error',
'import/no-unassigned-import': ['error', { allow: ['**/*.css'] }],
'import/order': [
'import-x/export': 'error',
'import-x/no-deprecated': 'error',
'import-x/no-empty-named-blocks': 'error',
'import-x/no-extraneous-dependencies': 'error',
'import-x/no-mutable-exports': 'error',
'import-x/no-named-as-default': 'error',
'import-x/no-named-as-default-member': 'error',
'import-x/no-amd': 'error',
'import-x/no-commonjs': 'error',
'import-x/no-nodejs-modules': 'off',
'import-x/default': 'error',
'import-x/named': 'error',
'import-x/namespace': 'error',
'import-x/no-absolute-path': 'error',
'import-x/no-cycle': 'error',
'import-x/no-dynamic-require': 'error',
'import-x/no-internal-modules': 'off',
'import-x/no-relative-packages': 'error',
'import-x/no-self-import': 'error',
'import-x/no-unresolved': ['error', { ignore: ['react'] }],
'import-x/no-useless-path-segments': 'error',
'import-x/no-webpack-loader-syntax': 'error',
'import-x/consistent-type-specifier-style': 'error',
'import-x/exports-last': 'off',
'import-x/extensions': ['error', 'never', { json: 'always' }],
'import-x/first': 'error',
'import-x/group-exports': 'off',
'import-x/newline-after-import': 'error',
'import-x/no-anonymous-default-export': 'off',
'import-x/no-default-export': 'off',
'import-x/no-duplicates': 'error',
'import-x/no-named-default': 'error',
'import-x/no-namespace': 'error',
'import-x/no-unassigned-import': ['error', { allow: ['**/*.css'] }],
'import-x/order': [
'error',
{
groups: ['builtin', 'external', 'internal', 'parent', 'sibling', 'index', 'object', 'type'],
@ -141,7 +157,7 @@ export default tseslint.config(
distinctGroup: true,
},
],
'import/prefer-default-export': 'off',
'import-x/prefer-default-export': 'off',
// Promise rules
'promise/catch-or-return': 'error',
@ -162,18 +178,14 @@ export default tseslint.config(
// Security and other rules
'no-catch-all/no-catch-all': 'error',
// ESLint comments rules
'@eslint-community/eslint-comments/no-unused-disable': 'error',
'@eslint-community/eslint-comments/disable-enable-pair': ['error', { allowWholeFile: true }],
// Additional import rules
'import/no-unused-modules': 'error',
'import/no-import-module-exports': 'error',
'import/unambiguous': 'off',
'import/no-relative-parent-imports': [
'import-x/no-unused-modules': 'error',
'import-x/no-import-module-exports': 'error',
'import-x/unambiguous': 'off',
'import-x/no-relative-parent-imports': [
'error',
{
ignore: ['#[src,types,root,components,utils,assets]/*'],
ignore: ['#[src,types,root,components,utils,assets]/*', '@/config/*'],
},
],
},
@ -227,4 +239,7 @@ export default tseslint.config(
'json/*': 'error',
},
},
// Prettier recommended config (should be last to override other formatting rules)
eslintPluginPrettierRecommended,
)

View File

@ -9,7 +9,7 @@
"scripts": {
"dev": "vite --host",
"build": "tsc && vite build",
"test:lint:eslint": "eslint --ext .ts,.tsx,.js,.jsx,.cjs,.mjs,.json,.yml,.yaml --max-warnings 0 .",
"test:lint:eslint": "eslint --max-warnings 0 .",
"preview": "vite preview"
},
"dependencies": {
@ -35,7 +35,7 @@
"daisyui": "^5.5.5",
"eslint": "^9.36.0",
"eslint-import-resolver-typescript": "^4.4.4",
"eslint-plugin-import": "^2.31.0",
"eslint-plugin-import-x": "^4.16.1",
"eslint-plugin-json": "^3.1.0",
"eslint-plugin-no-catch-all": "^1.1.0",
"eslint-plugin-promise": "^7.2.1",

View File

@ -1,221 +0,0 @@
// eslint-disable-next-line import/no-commonjs
module.exports = {
env: {
browser: true,
es2021: true,
},
extends: [
'standard',
'eslint:recommended',
'plugin:@eslint-community/eslint-comments/recommended',
'plugin:@typescript-eslint/recommended',
'plugin:import/recommended',
'plugin:import/typescript',
// 'plugin:promise/recommended',
'plugin:security/recommended-legacy',
'plugin:react/recommended',
],
parserOptions: {
ecmaVersion: 'latest',
parser: '@typescript-eslint/parser',
sourceType: 'module',
},
plugins: [
'@typescript-eslint',
'import',
'promise',
'security',
'no-catch-all',
'react',
'react-hooks',
'react-refresh',
],
settings: {
'import/resolver': {
typescript: true,
node: {
extensions: ['.js', '.jsx', '.ts', '.tsx'],
},
},
react: {
version: '18.2.0',
},
},
rules: {
'react-hooks/rules-of-hooks': 'error', // Checks rules of Hooks
'react-hooks/exhaustive-deps': 'warn', // Checks effect dependencies
'react/react-in-jsx-scope': 'off', // Disable requirement for React import
'no-catch-all/no-catch-all': 'error',
'no-console': 'error',
'no-debugger': 'error',
camelcase: 'error',
indent: ['error', 2],
'linebreak-style': ['error', 'unix'],
semi: ['error', 'never'],
// Optional eslint-comments rule
'@eslint-community/eslint-comments/no-unused-disable': 'error',
'@eslint-community/eslint-comments/disable-enable-pair': ['error', { allowWholeFile: true }],
// import
'import/export': 'error',
'import/no-deprecated': 'error',
'import/no-empty-named-blocks': 'error',
'import/no-extraneous-dependencies': 'error',
'import/no-mutable-exports': 'error',
'import/no-unused-modules': 'error',
'import/no-named-as-default': 'error',
'import/no-named-as-default-member': 'error',
'import/no-amd': 'error',
'import/no-commonjs': 'error',
'import/no-import-module-exports': 'error',
'import/no-nodejs-modules': 'off',
'import/unambiguous': 'off', // not compatible with scriptless vue files
'import/default': 'error',
'import/named': 'error',
'import/namespace': 'error',
'import/no-absolute-path': 'error',
'import/no-cycle': 'error',
'import/no-dynamic-require': 'error',
'import/no-internal-modules': 'off',
'import/no-relative-packages': 'error',
'import/no-relative-parent-imports': [
'error',
{
ignore: ['#[src,types,root,components,utils,assets]/*'],
},
],
'import/no-self-import': 'error',
'import/no-unresolved': [
'error',
{
ignore: ['react'],
},
],
'import/no-useless-path-segments': 'error',
'import/no-webpack-loader-syntax': 'error',
'import/consistent-type-specifier-style': 'error',
'import/exports-last': 'off',
'import/extensions': [
'error',
'never',
{
json: 'always',
},
],
'import/first': 'error',
'import/group-exports': 'off',
'import/newline-after-import': 'error',
'import/no-anonymous-default-export': 'off', // todo - consider to enable again
'import/no-default-export': 'off', // incompatible with vite & vike
'import/no-duplicates': 'error',
'import/no-named-default': 'error',
'import/no-namespace': 'error',
'import/no-unassigned-import': [
'error',
{
allow: ['**/*.css'],
},
],
'import/order': [
'error',
{
groups: ['builtin', 'external', 'internal', 'parent', 'sibling', 'index', 'object', 'type'],
'newlines-between': 'always',
alphabetize: {
order: 'asc', // sort in ascending order. Options: ["ignore", "asc", "desc"]
caseInsensitive: true, // ignore case. Options: [true, false]
},
distinctGroup: true,
},
],
'import/prefer-default-export': 'off',
// promise
'promise/catch-or-return': 'error',
'promise/no-return-wrap': 'error',
'promise/param-names': 'error',
'promise/always-return': 'error',
'promise/no-native': 'off',
'promise/no-nesting': 'warn',
'promise/no-promise-in-callback': 'warn',
'promise/no-callback-in-promise': 'warn',
'promise/avoid-new': 'warn',
'promise/no-new-statics': 'error',
'promise/no-return-in-finally': 'warn',
'promise/valid-params': 'warn',
'promise/prefer-await-to-callbacks': 'error',
'promise/no-multiple-resolved': 'error',
},
overrides: [
{
files: ['*.ts', '*.tsx'],
parser: '@typescript-eslint/parser',
parserOptions: {
tsconfigRootDir: __dirname,
project: ['./tsconfig.json', '**/tsconfig.json'],
ecmaVersion: 'latest',
parser: '@typescript-eslint/parser',
sourceType: 'module',
},
plugins: ['@typescript-eslint'],
extends: [
'plugin:@typescript-eslint/recommended',
'plugin:@typescript-eslint/recommended-requiring-type-checking',
'plugin:@typescript-eslint/strict',
],
rules: {
'@typescript-eslint/consistent-type-imports': 'error',
// allow explicitly defined dangling promises
'@typescript-eslint/no-floating-promises': ['error', { ignoreVoid: true }],
'no-void': ['error', { allowAsStatement: true }],
},
},
{
files: ['!*.json'],
plugins: ['prettier'],
extends: ['plugin:prettier/recommended'],
rules: {
'prettier/prettier': 'error',
},
},
{
files: ['*.json'],
plugins: ['json'],
extends: ['plugin:json/recommended-with-comments'],
},
// {
// files: ['*.{test,spec}.[tj]s'],
// plugins: ['vitest'],
// extends: ['plugin:vitest/all'],
// rules: {
// 'vitest/prefer-lowercase-title': 'off',
// 'vitest/no-hooks': 'off',
// 'vitest/consistent-test-filename': 'off',
// 'vitest/prefer-expect-assertions': [
// 'off',
// {
// onlyFunctionsWithExpectInLoop: true,
// onlyFunctionsWithExpectInCallback: true,
// },
// ],
// 'vitest/prefer-strict-equal': 'off',
// 'vitest/prefer-to-be-falsy': 'off',
// 'vitest/prefer-to-be-truthy': 'off',
// 'vitest/require-hook': [
// 'error',
// {
// allowedFunctionCalls: [
// 'mockClient.setRequestHandler',
// 'setActivePinia',
// 'provideApolloClient',
// ],
// },
// ],
// },
// },
{
files: ['*.yaml', '*.yml'],
parser: 'yaml-eslint-parser',
plugins: ['yml'],
extends: ['plugin:yml/prettier'],
},
],
}

231
lib/eslint.config.js Normal file
View File

@ -0,0 +1,231 @@
// ESLint v9 flat config for Utopia UI Library
import js from '@eslint/js'
import eslintCommentsConfigs from '@eslint-community/eslint-plugin-eslint-comments/configs'
import importXPlugin from 'eslint-plugin-import-x'
import jsonPlugin from 'eslint-plugin-json'
import noCatchAllPlugin from 'eslint-plugin-no-catch-all'
import eslintPluginPrettierRecommended from 'eslint-plugin-prettier/recommended'
import promisePlugin from 'eslint-plugin-promise'
import react from 'eslint-plugin-react'
import reactHooks from 'eslint-plugin-react-hooks'
import reactRefresh from 'eslint-plugin-react-refresh'
import securityPlugin from 'eslint-plugin-security'
import globals from 'globals'
import tseslint from 'typescript-eslint'
export default tseslint.config(
// Ignore patterns
{
ignores: ['dist/**', 'node_modules/**', 'coverage/**', 'docs/**'],
},
// Report unused eslint-disable directives (catches stale comments after rule renames)
{
linterOptions: {
reportUnusedDisableDirectives: 'error',
},
},
// Base ESLint recommended config
js.configs.recommended,
// ESLint comments recommended config
eslintCommentsConfigs.recommended,
// Security recommended config
securityPlugin.configs.recommended,
// React recommended configs
react.configs.flat.recommended,
react.configs.flat['jsx-runtime'],
// Main configuration for JavaScript/TypeScript files
{
files: ['**/*.{js,jsx,ts,tsx,cjs,mjs}'],
languageOptions: {
ecmaVersion: 'latest',
sourceType: 'module',
globals: {
...globals.browser,
...globals.es2021,
},
parserOptions: {
ecmaFeatures: {
jsx: true,
},
},
},
plugins: {
'react': react,
'react-hooks': reactHooks,
'react-refresh': reactRefresh,
'import-x': importXPlugin,
'promise': promisePlugin,
'no-catch-all': noCatchAllPlugin,
},
settings: {
react: {
version: '18.2.0',
},
'import-x/resolver': {
typescript: true,
node: {
extensions: ['.js', '.jsx', '.ts', '.tsx'],
},
},
},
rules: {
// Basic rules
'no-console': 'error',
'no-debugger': 'error',
'camelcase': 'error',
// Standard JS rules
'semi': ['error', 'never'],
'quotes': ['error', 'single', { avoidEscape: true }],
'comma-dangle': ['error', 'always-multiline'],
'keyword-spacing': ['error', { before: true, after: true }],
'space-infix-ops': 'error',
'eol-last': ['error', 'always'],
'no-trailing-spaces': 'error',
'object-curly-spacing': ['error', 'always'],
'array-bracket-spacing': ['error', 'never'],
'computed-property-spacing': ['error', 'never'],
'no-multiple-empty-lines': ['error', { max: 1, maxEOF: 0 }],
'indent': ['error', 2],
'linebreak-style': ['error', 'unix'],
'eqeqeq': ['error', 'always', { null: 'ignore' }],
'new-cap': ['error', { newIsCap: true, capIsNew: false, properties: true }],
'array-callback-return': ['error', { allowImplicit: false, checkForEach: false }],
// React rules
'react/react-in-jsx-scope': 'off',
'react/no-unescaped-entities': 'error',
'react-hooks/rules-of-hooks': 'error',
'react-hooks/exhaustive-deps': 'warn',
// Import rules
'import-x/export': 'error',
'import-x/no-deprecated': 'error',
'import-x/no-empty-named-blocks': 'error',
'import-x/no-extraneous-dependencies': 'error',
'import-x/no-mutable-exports': 'error',
'import-x/no-named-as-default': 'error',
'import-x/no-named-as-default-member': 'error',
'import-x/no-amd': 'error',
'import-x/no-commonjs': 'error',
'import-x/no-nodejs-modules': 'off',
'import-x/default': 'error',
'import-x/named': 'error',
'import-x/namespace': 'error',
'import-x/no-absolute-path': 'error',
'import-x/no-cycle': 'error',
'import-x/no-dynamic-require': 'error',
'import-x/no-internal-modules': 'off',
'import-x/no-relative-packages': 'error',
'import-x/no-self-import': 'error',
'import-x/no-unresolved': ['error', { ignore: ['react'] }],
'import-x/no-useless-path-segments': 'error',
'import-x/no-webpack-loader-syntax': 'error',
'import-x/consistent-type-specifier-style': 'error',
'import-x/exports-last': 'off',
'import-x/extensions': ['error', 'never', { json: 'always' }],
'import-x/first': 'error',
'import-x/group-exports': 'off',
'import-x/newline-after-import': 'error',
'import-x/no-anonymous-default-export': 'off',
'import-x/no-default-export': 'off',
'import-x/no-duplicates': 'error',
'import-x/no-named-default': 'error',
'import-x/no-namespace': 'error',
'import-x/no-unassigned-import': ['error', { allow: ['**/*.css'] }],
'import-x/order': [
'error',
{
groups: ['builtin', 'external', 'internal', 'parent', 'sibling', 'index', 'object', 'type'],
'newlines-between': 'always',
alphabetize: { order: 'asc', caseInsensitive: true },
distinctGroup: true,
},
],
'import-x/prefer-default-export': 'off',
'import-x/no-unused-modules': 'error',
'import-x/no-import-module-exports': 'error',
'import-x/unambiguous': 'off',
'import-x/no-relative-parent-imports': ['error', { ignore: ['#[src,types,root,components,utils,assets]/*'] }],
// Promise rules
'promise/catch-or-return': 'error',
'promise/no-return-wrap': 'error',
'promise/param-names': 'error',
'promise/always-return': 'error',
'promise/no-native': 'off',
'promise/no-nesting': 'warn',
'promise/no-promise-in-callback': 'warn',
'promise/no-callback-in-promise': 'warn',
'promise/avoid-new': 'warn',
'promise/no-new-statics': 'error',
'promise/no-return-in-finally': 'warn',
'promise/valid-params': 'warn',
'promise/prefer-await-to-callbacks': 'error',
'promise/no-multiple-resolved': 'error',
// Security and other rules
'no-catch-all/no-catch-all': 'error',
},
},
// TypeScript configs (applied after main config)
...tseslint.configs.recommended,
...tseslint.configs.strict,
...tseslint.configs.stylistic,
// TypeScript type-checking configuration
{
files: ['**/*.{ts,tsx}'],
extends: [
...tseslint.configs.recommendedTypeChecked,
...tseslint.configs.strictTypeChecked,
...tseslint.configs.stylisticTypeChecked,
],
languageOptions: {
parserOptions: {
project: ['./tsconfig.json'],
tsconfigRootDir: import.meta.dirname,
},
},
rules: {
'@typescript-eslint/consistent-type-imports': 'error',
'@typescript-eslint/no-floating-promises': ['error', { ignoreVoid: true }],
'no-void': ['error', { allowAsStatement: true }],
// Disable empty function rule - legitimate use in React contexts
'@typescript-eslint/no-empty-function': 'off',
// Configure no-unused-expressions to allow logical AND and ternary patterns
'@typescript-eslint/no-unused-expressions': ['error', {
allowShortCircuit: true,
allowTernary: true,
}],
},
},
// JSON files configuration
{
files: ['**/*.json'],
plugins: {
json: jsonPlugin,
},
rules: {
// Disable TypeScript-specific rules for JSON files
'@typescript-eslint/no-unused-expressions': 'off',
// JSON-specific rules
'json/*': 'error',
},
},
// Prettier recommended config (should be last to override other formatting rules)
eslintPluginPrettierRecommended,
)

View File

@ -26,7 +26,7 @@
"scripts": {
"build": "rollup -c",
"start": "rollup -c -w",
"test:lint:eslint": "eslint --ext .ts,.tsx,.js,.jsx,.cjs,.mjs,.json,.yml,.yaml --max-warnings 0 .",
"test:lint:eslint": "eslint --max-warnings 0 .",
"lint": "npm run test:lint:eslint",
"lintfix": "npm run test:lint:eslint -- --fix",
"test:component": "cypress run --component --browser electron",
@ -64,7 +64,7 @@
"eslint": "^9.36.0",
"eslint-config-prettier": "^10.1.8",
"eslint-import-resolver-typescript": "^4.4.4",
"eslint-plugin-import": "^2.31.0",
"eslint-plugin-import-x": "^4.16.1",
"eslint-plugin-json": "^3.1.0",
"eslint-plugin-no-catch-all": "^1.1.0",
"eslint-plugin-prettier": "^5.2.1",
@ -73,7 +73,6 @@
"eslint-plugin-react-hooks": "^7.0.1",
"eslint-plugin-react-refresh": "^0.4.24",
"eslint-plugin-security": "^3.0.1",
"eslint-plugin-yml": "^1.14.0",
"globals": "^16.3.0",
"happy-dom": "^20.0.11",
"postcss": "^8.4.21",

5703
package-lock.json generated

File diff suppressed because it is too large Load Diff