feat: update React ESLint config (#51)

Author: chenjiahan

template-eslint/react-js/eslint.config.mjs

@@ -1,29 +1,29 @@
-import { fixupConfigRules } from '@eslint/compat';
 import js from '@eslint/js';
-import reactJsx from 'eslint-plugin-react/configs/jsx-runtime.js';
-import react from 'eslint-plugin-react/configs/recommended.js';
+import { defineConfig, globalIgnores } from 'eslint/config';
 import reactHooks from 'eslint-plugin-react-hooks';
+import reactRefresh from 'eslint-plugin-react-refresh';
 import globals from 'globals';
 
-export default [
-  { languageOptions: { globals: globals.browser } },
-  js.configs.recommended,
-  ...fixupConfigRules([
-    {
-      ...react,
-      settings: {
-        react: { version: 'detect' },
-      },
-    },
-    reactJsx,
-  ]),
+export default defineConfig([
+  globalIgnores(['dist']),
   {
-    plugins: {
-      'react-hooks': reactHooks,
+    files: ['**/*.{js,jsx}'],
+    extends: [
+      js.configs.recommended,
+      reactHooks.configs['recommended-latest'],
+      reactRefresh.configs.vite,
+    ],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+      parserOptions: {
+        ecmaVersion: 'latest',
+        ecmaFeatures: { jsx: true },
+        sourceType: 'module',
+      },
     },
     rules: {
-      ...reactHooks.configs.recommended.rules,
+      'no-unused-vars': ['error', { varsIgnorePattern: '^[A-Z_]' }],
     },
   },
-  { ignores: ['dist/'] },
-];
+]);

template-eslint/react-js/package.json

@@ -9,8 +9,8 @@
     "@eslint/compat": "^1.3.1",
     "@eslint/js": "^9.30.0",
     "eslint": "^9.30.0",
-    "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^5.2.0",
+    "eslint-plugin-react-refresh": "^0.4.20",
     "globals": "^16.2.0"
   }
 }

template-eslint/react-ts/eslint.config.mjs

@@ -1,31 +1,23 @@
-import { fixupConfigRules } from '@eslint/compat';
 import js from '@eslint/js';
-import reactJsx from 'eslint-plugin-react/configs/jsx-runtime.js';
-import react from 'eslint-plugin-react/configs/recommended.js';
+import { globalIgnores } from 'eslint/config';
 import reactHooks from 'eslint-plugin-react-hooks';
+import reactRefresh from 'eslint-plugin-react-refresh';
 import globals from 'globals';
-import ts from 'typescript-eslint';
+import tseslint from 'typescript-eslint';
 
-export default [
-  { languageOptions: { globals: globals.browser } },
-  js.configs.recommended,
-  ...ts.configs.recommended,
-  ...fixupConfigRules([
-    {
-      ...react,
-      settings: {
-        react: { version: 'detect' },
-      },
-    },
-    reactJsx,
-  ]),
+export default tseslint.config([
+  globalIgnores(['dist']),
   {
-    plugins: {
-      'react-hooks': reactHooks,
-    },
-    rules: {
-      ...reactHooks.configs.recommended.rules,
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      js.configs.recommended,
+      tseslint.configs.recommended,
+      reactHooks.configs['recommended-latest'],
+      reactRefresh.configs.vite,
+    ],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
     },
   },
-  { ignores: ['dist/'] },
-];
+]);

template-eslint/react-ts/package.json

@@ -9,8 +9,8 @@
     "@eslint/compat": "^1.3.1",
     "@eslint/js": "^9.30.0",
     "eslint": "^9.30.0",
-    "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^5.2.0",
+    "eslint-plugin-react-refresh": "^0.4.20",
     "globals": "^16.2.0",
     "typescript-eslint": "^8.35.1"
   }