@dendavidov/eslint-config-react 1.1.45 → 2.0.1

package/README.md

@@ -16,21 +16,33 @@ npm i -D @dendavidov/eslint-config-react
 
 ## Usage
 
-Add .eslintrc.json in the root of your project
-```json
-{
-  "extends": "@dendavidov/eslint-config-react"
-}
+Create `eslint.config.js` in the root of your project:
+```javascript
+import config from '@dendavidov/eslint-config-react';
+
+export default config;
 ```
-Add script to package.json -> scripts:
+
+Or extend with your own rules:
+```javascript
+import config from '@dendavidov/eslint-config-react';
+
+export default [
+  ...config,
+  {
+    rules: {
+      // Your custom rules
+    }
+  }
+];
 ```
+
+Add script to package.json:
+```json
 {
-  ...
   "scripts": {
-    ...
-    "lint": "eslint './src/**/*.{ts,tsx}'"
-  },
-  ...
+    "lint": "eslint './src/**/*.{ts,tsx,js,jsx}'"
+  }
 }
 ```
 

package/package.json

@@ -1,15 +1,12 @@
 {
   "name": "@dendavidov/eslint-config-react",
-  "version": "1.1.45",
-  "description": "eslint config",
+  "version": "2.0.1",
+  "description": "Shareable ESLint config for React + TypeScript (ESLint 9+)",
+  "type": "module",
   "main": "src/index.js",
+  "types": "src/index.d.ts",
   "license": "MIT",
-  "scripts": {
-    "test": "jest --watchAll=false",
-    "release": "npx semantic-release",
-    "prepare": "npx husky install"
-  },
-  "author": "Denis Davydov mail@dendavidov.com",
+  "author": "Denis Davydov <mail@dendavidov.com>",
   "repository": {
     "type": "git",
     "url": "git@github.com:dendavidov/eslint-config-react.git"
@@ -24,27 +21,48 @@
   "files": [
     "LICENSE",
     "README.md",
-    "src/index.js"
+    "src/index.js",
+    "src/index.d.ts"
   ],
-  "devDependencies": {
-    "@commitlint/cli": "^19.3.0",
-    "@commitlint/config-conventional": "^19.2.2",
-    "@semantic-release/git": "^10.0.1",
-    "conventional-changelog-conventionalcommits": "^7.0.2",
-    "husky": "^9.0.11",
-    "jest": "^29.5.0",
-    "prettier": "^3.0.0"
+  "scripts": {
+    "test": "NODE_OPTIONS=--experimental-vm-modules jest --watchAll=false",
+    "format": "prettier --write .",
+    "format:check": "prettier --check ./src",
+    "release": "npx semantic-release",
+    "prepare": "npx husky install"
   },
   "dependencies": {
-    "@typescript-eslint/eslint-plugin": "^7.8.0",
-    "@typescript-eslint/parser": "^7.8.0",
-    "eslint": "^8.37.0",
-    "eslint-config-prettier": "^9.0.0",
-    "eslint-import-resolver-typescript": "^3.5.5",
-    "eslint-plugin-import": "^2.27.5",
-    "eslint-plugin-jest": "^28.3.0",
-    "eslint-plugin-jsx-a11y": "^6.7.1",
-    "eslint-plugin-react": "^7.32.2",
-    "eslint-plugin-testing-library": "^6.0.1"
+    "@eslint/js": "^9.31.0"
+  },
+  "peerDependencies": {
+    "@typescript-eslint/eslint-plugin": "^8.36.0",
+    "@typescript-eslint/parser": "^8.36.0",
+    "eslint": "^9.0.0",
+    "eslint-config-prettier": "^10.1.5",
+    "eslint-import-resolver-typescript": "^4.4.4",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-jest": "^29.0.1",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-testing-library": "^7.5.4"
+  },
+  "devDependencies": {
+    "@commitlint/cli": "^19.8.1",
+    "@commitlint/config-conventional": "^19.8.1",
+    "@semantic-release/git": "^10.0.1",
+    "@typescript-eslint/eslint-plugin": "^8.36.0",
+    "@typescript-eslint/parser": "^8.36.0",
+    "conventional-changelog-conventionalcommits": "^9.1.0",
+    "eslint": "^9.31.0",
+    "eslint-config-prettier": "^10.1.5",
+    "eslint-import-resolver-typescript": "^4.4.4",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-jest": "^29.0.1",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-testing-library": "^7.5.4",
+    "husky": "^9.1.7",
+    "jest": "^30.0.4",
+    "prettier": "^3.6.2"
   }
 }

package/src/index.d.ts

@@ -0,0 +1,5 @@
+import type { Linter } from 'eslint';
+
+declare const config: Linter.FlatConfig[];
+
+export default config;

package/src/index.js

@@ -1,66 +1,323 @@
-module.exports = {
-  extends: [
-    // By extending from a plugin config, we can get recommended rules without having to add them manually.
-    'eslint:recommended',
-    'plugin:react/recommended',
-    'plugin:import/recommended',
-    'plugin:jsx-a11y/recommended',
-    'plugin:@typescript-eslint/recommended',
-    'plugin:@typescript-eslint/recommended-requiring-type-checking',
-    'plugin:@typescript-eslint/strict',
-    // This disables the formatting rules in ESLint that Prettier is going to be responsible for handling.
-    // Make sure it's always the last config, so it gets the chance to override other configs.
-    'eslint-config-prettier',
-  ],
-  "parserOptions": {
-    "project": "./tsconfig.json",
-    "ecmaVersion": 12,
-    "sourceType": "module"
+import js from '@eslint/js';
+import reactPlugin from 'eslint-plugin-react';
+import importPlugin from 'eslint-plugin-import';
+import jsxA11yPlugin from 'eslint-plugin-jsx-a11y';
+import tsPlugin from '@typescript-eslint/eslint-plugin';
+import tsParser from '@typescript-eslint/parser';
+import jestPlugin from 'eslint-plugin-jest';
+import testingLibraryPlugin from 'eslint-plugin-testing-library';
+import prettierConfig from 'eslint-config-prettier';
+
+export default [
+  // core ESLint recommended
+  js.configs.recommended,
+
+  // React configuration
+  {
+    files: ['**/*.{js,jsx,ts,tsx}'],
+    languageOptions: {
+      ecmaVersion: 2020,
+      sourceType: 'module',
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true,
+        },
+      },
+      globals: {
+        // Browser globals
+        window: 'readonly',
+        document: 'readonly',
+        console: 'readonly',
+        localStorage: 'readonly',
+        sessionStorage: 'readonly',
+        fetch: 'readonly',
+        setTimeout: 'readonly',
+        clearTimeout: 'readonly',
+        setInterval: 'readonly',
+        clearInterval: 'readonly',
+        alert: 'readonly',
+        confirm: 'readonly',
+        prompt: 'readonly',
+        // React globals
+        React: 'readonly',
+        JSX: 'readonly',
+      },
+    },
+    plugins: {
+      react: reactPlugin,
+    },
+    rules: {
+      ...reactPlugin.configs.recommended.rules,
+      'react/react-in-jsx-scope': 'off',
+    },
+    settings: {
+      react: { version: 'detect' },
+    },
+  },
+
+  // Import configuration
+  {
+    files: ['**/*.{js,jsx,ts,tsx}'],
+    languageOptions: {
+      ecmaVersion: 2020,
+      sourceType: 'module',
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true,
+        },
+      },
+      globals: {
+        // Browser globals
+        window: 'readonly',
+        document: 'readonly',
+        console: 'readonly',
+        localStorage: 'readonly',
+        sessionStorage: 'readonly',
+        fetch: 'readonly',
+        setTimeout: 'readonly',
+        clearTimeout: 'readonly',
+        setInterval: 'readonly',
+        clearInterval: 'readonly',
+        // React globals
+        React: 'readonly',
+        JSX: 'readonly',
+      },
+    },
+    plugins: {
+      import: importPlugin,
+    },
+    rules: {
+      ...importPlugin.configs.recommended.rules,
+      'import/no-unresolved': [2, { ignore: ['react-dom/client'] }],
+    },
+    settings: {
+      'import/resolver': {
+        node: { paths: ['src'], extensions: ['.ts', '.tsx'] },
+        typescript: {},
+      },
+    },
+  },
+
+  // JSX A11y configuration
+  {
+    files: ['**/*.{js,jsx,ts,tsx}'],
+    languageOptions: {
+      ecmaVersion: 2020,
+      sourceType: 'module',
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true,
+        },
+      },
+      globals: {
+        // Browser globals
+        window: 'readonly',
+        document: 'readonly',
+        console: 'readonly',
+        localStorage: 'readonly',
+        sessionStorage: 'readonly',
+        fetch: 'readonly',
+        setTimeout: 'readonly',
+        clearTimeout: 'readonly',
+        setInterval: 'readonly',
+        clearInterval: 'readonly',
+        // React globals
+        React: 'readonly',
+        JSX: 'readonly',
+      },
+    },
+    plugins: {
+      'jsx-a11y': jsxA11yPlugin,
+    },
+    rules: {
+      ...jsxA11yPlugin.configs.recommended.rules,
+    },
   },
-  plugins: ['jest', 'testing-library', '@typescript-eslint'],
-  settings: {
-    react: {
-      // Tells eslint-plugin-react to automatically detect the version of React to use.
-      version: 'detect',
-    },
-    // Tells eslint how to resolve imports
-    'import/resolver': {
-      node: {
-        paths: ['src'],
-        extensions: ['.ts', '.tsx'],
+
+  // TypeScript configuration
+  {
+    files: ['**/*.{ts,tsx}'],
+    languageOptions: {
+      parser: tsParser,
+      parserOptions: {
+        ecmaVersion: 2020,
+        sourceType: 'module',
+        project: './tsconfig.json',
+        ecmaFeatures: {
+          jsx: true,
+        },
+      },
+      globals: {
+        // Browser globals
+        window: 'readonly',
+        document: 'readonly',
+        console: 'readonly',
+        localStorage: 'readonly',
+        sessionStorage: 'readonly',
+        fetch: 'readonly',
+        setTimeout: 'readonly',
+        clearTimeout: 'readonly',
+        setInterval: 'readonly',
+        clearInterval: 'readonly',
+        alert: 'readonly',
+        confirm: 'readonly',
+        prompt: 'readonly',
+        // React globals
+        React: 'readonly',
+        JSX: 'readonly',
       },
-      typescript: {},
+    },
+    plugins: {
+      '@typescript-eslint': tsPlugin,
+    },
+    rules: {
+      ...tsPlugin.configs.recommended.rules,
+      ...tsPlugin.configs['recommended-type-checked'].rules,
+      ...tsPlugin.configs.strict.rules,
     },
   },
-  overrides: [
-    {
-      files: ['**/__tests__/**/*', '**/*.{spec,test}.*'],
-      env: {
-        'jest/globals': true,
+
+  // disable formatting rules in ESLint so Prettier can run unopposed
+  prettierConfig,
+
+  // Test files configuration
+  {
+    files: ['**/__tests__/**/*', '**/*.{spec,test}.*', '**/jest.setup.*'],
+    languageOptions: {
+      ecmaVersion: 2020,
+      sourceType: 'module',
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true,
+        },
+      },
+      globals: {
+        // Jest globals
+        afterAll: 'readonly',
+        afterEach: 'readonly',
+        beforeAll: 'readonly',
+        beforeEach: 'readonly',
+        describe: 'readonly',
+        expect: 'readonly',
+        fit: 'readonly',
+        it: 'readonly',
+        jest: 'readonly',
+        test: 'readonly',
+        xdescribe: 'readonly',
+        xit: 'readonly',
+        xtest: 'readonly',
+        // Node.js globals for setup files
+        global: 'writable',
+        // Browser globals (for JSDOM environment)
+        window: 'readonly',
+        document: 'readonly',
+        console: 'readonly',
+        localStorage: 'readonly',
+        sessionStorage: 'readonly',
+        fetch: 'readonly',
+        setTimeout: 'readonly',
+        clearTimeout: 'readonly',
+        setInterval: 'readonly',
+        clearInterval: 'readonly',
+        // React globals
+        React: 'readonly',
+        JSX: 'readonly',
       },
-      // A subset of the recommended rules:
-      rules: {
-        // https://github.com/jest-community/eslint-plugin-jest
-        'jest/no-conditional-expect': 'error',
-        'jest/no-identical-title': 'error',
-        'jest/no-interpolation-in-snapshots': 'error',
-        'jest/no-jasmine-globals': 'error',
-        'jest/no-mocks-import': 'error',
-        'jest/valid-describe-callback': 'error',
-        'jest/valid-expect': 'error',
-        'jest/valid-expect-in-promise': 'error',
-        'jest/valid-title': 'warn',
+    },
+    plugins: {
+      jest: jestPlugin,
+      'testing-library': testingLibraryPlugin,
+    },
+    rules: {
+      ...jestPlugin.configs.recommended.rules,
+      'jest/no-conditional-expect': 'error',
+      'jest/no-identical-title': 'error',
+      'jest/no-interpolation-in-snapshots': 'error',
+      'jest/no-jasmine-globals': 'error',
+      'jest/no-mocks-import': 'error',
+      'jest/valid-describe-callback': 'error',
+      'jest/valid-expect': 'error',
+      'jest/valid-expect-in-promise': 'error',
+      'jest/valid-title': 'warn',
+      'testing-library/await-async-queries': 'error',
+      'testing-library/await-async-utils': 'error',
+      'testing-library/no-dom-import': ['error', 'react'],
+      'testing-library/no-wait-for-snapshot': 'error',
+    },
+  },
 
-        // https://github.com/testing-library/eslint-plugin-testing-library
-        'testing-library/await-async-queries': 'error',
-        'testing-library/await-async-utils': 'error',
-        'testing-library/no-dom-import': ['error', 'react'],
-        'testing-library/no-wait-for-snapshot': 'error',
+  // TypeScript test files configuration
+  {
+    files: ['**/__tests__/**/*.{ts,tsx}', '**/*.{spec,test}.{ts,tsx}', '**/jest.setup.{ts,tsx}'],
+    languageOptions: {
+      parser: tsParser,
+      parserOptions: {
+        ecmaVersion: 2020,
+        sourceType: 'module',
+        project: './tsconfig.json',
+        ecmaFeatures: {
+          jsx: true,
+        },
+      },
+      globals: {
+        // Jest globals
+        afterAll: 'readonly',
+        afterEach: 'readonly',
+        beforeAll: 'readonly',
+        beforeEach: 'readonly',
+        describe: 'readonly',
+        expect: 'readonly',
+        fit: 'readonly',
+        it: 'readonly',
+        jest: 'readonly',
+        test: 'readonly',
+        xdescribe: 'readonly',
+        xit: 'readonly',
+        xtest: 'readonly',
+        // Node.js globals for setup files
+        global: 'writable',
+        // Browser globals (for JSDOM environment)
+        window: 'readonly',
+        document: 'readonly',
+        console: 'readonly',
+        localStorage: 'readonly',
+        sessionStorage: 'readonly',
+        fetch: 'readonly',
+        setTimeout: 'readonly',
+        clearTimeout: 'readonly',
+        setInterval: 'readonly',
+        clearInterval: 'readonly',
+        // React globals
+        React: 'readonly',
+        JSX: 'readonly',
       },
     },
-  ],
-  rules: {
-    'react/react-in-jsx-scope': 'off',
-    'import/no-unresolved': [2, { ignore: ['react-dom/client'] }],
+    plugins: {
+      '@typescript-eslint': tsPlugin,
+      jest: jestPlugin,
+      'testing-library': testingLibraryPlugin,
+    },
+    rules: {
+      // TypeScript rules
+      ...tsPlugin.configs.recommended.rules,
+      ...tsPlugin.configs['recommended-type-checked'].rules,
+      ...tsPlugin.configs.strict.rules,
+      // Jest rules
+      ...jestPlugin.configs.recommended.rules,
+      'jest/no-conditional-expect': 'error',
+      'jest/no-identical-title': 'error',
+      'jest/no-interpolation-in-snapshots': 'error',
+      'jest/no-jasmine-globals': 'error',
+      'jest/no-mocks-import': 'error',
+      'jest/valid-describe-callback': 'error',
+      'jest/valid-expect': 'error',
+      'jest/valid-expect-in-promise': 'error',
+      'jest/valid-title': 'warn',
+      // Testing Library rules
+      'testing-library/await-async-queries': 'error',
+      'testing-library/await-async-utils': 'error',
+      'testing-library/no-dom-import': ['error', 'react'],
+      'testing-library/no-wait-for-snapshot': 'error',
+    },
   },
-};
+];