feat: Use eslint flat configs

ntucker · Sep 5, 2024 · 2fa1c28 · 2fa1c28
1 parent d16d2cf
commit 2fa1c28
Show file tree

Hide file tree

Showing 18 changed files with 241 additions and 223 deletions.
diff --git a/.editorconfig b/.editorconfig
diff --git a/.eslintignore b/.eslintignore
diff --git a/.eslintrc.js b/.eslintrc.js
diff --git a/eslint.config.mjs b/eslint.config.mjs
@@ -0,0 +1,32 @@
+import globals from 'globals';
+
+import anansiPlugin from '@anansi/eslint-plugin';
+
+export default [
+  ...anansiPlugin.configs.typescript,
+  {
+    ignores: [
+      'lib*/*',
+      'dist*/*',
+      'generators*/*',
+      'packages/generator-js/**/templates',
+      'packages/jest-preset-anansi/**/templates',
+    ],
+  },
+  {
+    files: [
+      'packages/eslint-plugin/*',
+      'packages/webpack-config-anansi/**',
+      'packages/jest-preset-anansi/**',
+      'packages/generator-js/**',
+      'packages/cli/**',
+      'packages/babel-preset-anansi/*',
+      'babel.config.js',
+    ],
+    languageOptions: {
+      globals: {
+        ...globals.node,
+      },
+    },
+  },
+];
diff --git a/package.json b/package.json
@@ -21,7 +21,7 @@
     "release": "yarn workspaces foreach -Wtiv --no-private npm publish --access public --tolerate-republish",
     "build": "yarn workspaces foreach -Wt --no-private run build",
     "dev": "yarn workspaces foreach -Wpi --no-private run dev",
-    "lint": "eslint packages/*/src",
+    "lint": "eslint --quiet packages/*/src",
     "format": "eslint --fix packages/*/src",
     "build:types": "tsc --build",
     "build:pkg": "run build:types && yarn workspace \"@anansi/webpack-config\" run build && yarn workspaces foreach -Wtv --no-private run build",
@@ -49,19 +49,13 @@
     "@commitlint/config-conventional": "18.6.2",
     "@lerna-lite/cli": "3.9.0",
     "@types/node": "^22.0.0",
-    "@typescript-eslint/eslint-plugin": "8.4.0",
-    "@typescript-eslint/parser": "8.4.0",
     "babel-loader": "9.1.3",
     "babel-plugin-module-resolver": "5.0.2",
     "babel-plugin-root-import": "6.6.0",
     "conventional-changelog-anansi": "0.2.0",
     "conventional-changelog-conventionalcommits": "6.1.0",
     "eslint": "9.9.1",
-    "eslint-plugin-babel": "^5.3.1",
-    "eslint-plugin-import": "2.30.0",
-    "eslint-plugin-prettier": "5.2.1",
-    "eslint-plugin-react": "7.35.2",
-    "eslint-plugin-react-hooks": "4.6.2",
+    "globals": "^15.9.0",
     "husky": "9.1.5",
     "jest": "^29.5.0",
     "lint-staged": "15.2.10",

diff --git a/packages/babel-preset-anansi/.eslintrc.js b/packages/babel-preset-anansi/.eslintrc.js
diff --git a/packages/cli/.eslintrc.js b/packages/cli/.eslintrc.js
diff --git a/packages/eslint-plugin/.eslintrc.js b/packages/eslint-plugin/.eslintrc.js
diff --git a/packages/eslint-plugin/README.md b/packages/eslint-plugin/README.md
@@ -6,50 +6,58 @@
 
 ## Installation
 
-[Eslint has decided it is necessary for users to install all plugins manually](https://github.com/eslint/rfcs/pull/5)
-
-`yarn add --dev @anansi/eslint-plugin eslint-plugin-prettier eslint-plugin-import eslint-plugin-react eslint-plugin-react-hooks`
+`yarn add --dev @anansi/eslint-plugin`
 
 ## Usage
 
 ### TypeScript + Javascript
 
 Be sure to configure the project option properly - especially if you have a monorepo.
 
-**`.eslintrc.js`**
+**`eslint.config.js`**
 
 ```js
-module.exports = {
-  extends: 'plugin:@anansi/typescript',
-  parserOptions: {
-    tsconfigRootDir: __dirname,
-    project: ['tsconfig.json'],
+import anansiPlugin from '@anansi/eslint-plugin';
+
+export default [
+  anansiPlugin.configs.typescript,
+  {
+    languageOptions: {
+      tsconfigRootDir: import.meta.dirname,
+      project: ['tsconfig.json'],
+    }
   }
-}
+];
 ```
 
 ### TypeScript monorepo
 
-**`.eslintrc.js`**
+**`eslint.config.js`**
 
 ```js
-module.exports = {
-  extends: 'plugin:@anansi/typescript',
-  parserOptions: {
-    tsconfigRootDir: __dirname,
-    project: ['packages/*/tsconfig.json'],
+import anansiPlugin from '@anansi/eslint-plugin';
+
+export default [
+  anansiPlugin.configs.typescript,
+  {
+    languageOptions: {
+      tsconfigRootDir: import.meta.dirname,
+      project: ['packages/*/tsconfig.json'],
+    }
   }
-}
+];
 ```
 
 ### Just JavaScript
 
-**`.eslintrc.js`**
+**`eslint.config.js`**
 
 ```js
-{
-  extends: 'plugin:@anansi/javascript'
-}
+import anansiPlugin from '@anansi/eslint-plugin';
+
+export default [
+  anansiPlugin.configs.javascript,
+];
 ```
 
 ## Style guidelines

diff --git a/packages/eslint-plugin/base.js b/packages/eslint-plugin/base.js
@@ -1,16 +1,36 @@
-const config = {
+import babelParser from '@babel/eslint-parser';
+import babelPlugin from '@babel/eslint-plugin';
+import js from '@eslint/js';
+import prettierConfig from 'eslint-config-prettier';
+import importPlugin from 'eslint-plugin-import';
+import prettierPlugin from 'eslint-plugin-prettier';
+import reactPlugin from 'eslint-plugin-react';
+import reactHooksPlugin from 'eslint-plugin-react-hooks';
+import globals from 'globals';
+import tsPlugin from 'typescript-eslint';
+
+import isInstalled from './isInstalled.cjs';
+
+const generalRules = {
   // TODO: instead of including TS stuff, just have the base, but then programatically order things
   // properly in the extends
-  env: {
-    jest: true,
-    browser: true,
-    es6: true,
+  languageOptions: {
+    globals: {
+      ...globals.jest,
+      ...globals.browser,
+      ...globals.es2024,
+    },
+  },
+  plugins: {
+    prettier: prettierPlugin,
+    'react-hooks': reactHooksPlugin,
+    import: importPlugin,
+    react: reactPlugin,
   },
-  plugins: ['prettier', 'react-hooks', 'import', 'react'],
   rules: {
     'prettier/prettier': 'error',
     'react-hooks/rules-of-hooks': 'error',
-    'react-hooks/exhaustive-deps': 'warn',
+    'react-hooks/exhaustive-deps': 'off', // TODO: re-enable once compatible with flat configs https://github.com/facebook/react/issues/28313
     'react/prefer-stateless-function': 'error',
     'lines-between-class-members': [
       'warn',
@@ -38,42 +58,70 @@ const config = {
       version: 'detect',
     },
     'import/parsers': {
-      '@typescript-eslint/parser': ['.ts', '.tsx', '.cts', '.mts'],
+      '@typescript-eslint/parser': [
+        '.ts',
+        '.tsx',
+        '.cts',
+        '.mts',
+        '.ctsx',
+        '.mtsx',
+      ],
     },
   },
-  overrides: [
-    {
-      files: ['**/*.?(m|c)ts?(x)'],
-      extends: [
-        'eslint:recommended',
-        'plugin:@typescript-eslint/recommended',
-        'plugin:react/recommended',
-        'prettier',
-      ],
+};
+
+const config = [
+  {
+    ...js.configs.recommended,
+    files: ['**/*.?(m|c)ts?(x)'],
+  },
+  ...tsPlugin.configs.recommended.map(config => ({
+    ...config,
+    files: ['**/*.?(m|c)ts?(x)'],
+  })),
+  {
+    ...reactPlugin.configs.flat.recommended,
+    files: ['**/*.?(m|c)ts?(x)'],
+  },
+  {
+    ...prettierConfig.flat,
+    files: ['**/*.?(m|c)ts?(x)'],
+  },
+  {
+    ...js.configs.recommended,
+    files: ['**/*.?(m|c)js?(x)'],
+  },
+  {
+    ...reactPlugin.configs.flat.recommended,
+    files: ['**/*.?(m|c)js?(x)'],
+  },
+  {
+    ...prettierConfig.flat,
+    files: ['**/*.?(m|c)js?(x)'],
+  },
+  {
+    files: ['**/*.?(m|c)js?(x)'],
+    languageOptions: {
+      parser: babelParser,
+      sourceType: 'module',
+      // allowImportExportEverywhere: true,
+      ecmaVersion: 2024,
+      // ecmaFeatures: {
+      //   jsx: true,
+      //   experimentalObjectRestSpread: true,
+      // },
+      // requireConfigFile: false,
     },
-    {
-      files: ['**/*.?(m)js?(x)'],
-      extends: ['eslint:recommended', 'plugin:react/recommended', 'prettier'],
-      parser: '@babel/eslint-parser',
-      parserOptions: {
-        sourceType: 'module',
-        allowImportExportEverywhere: true,
-        ecmaVersion: 2020,
-        ecmaFeatures: {
-          jsx: true,
-          experimentalObjectRestSpread: true,
-        },
-        requireConfigFile: false,
-      },
-      plugins: ['babel'],
+    plugins: { babel: babelPlugin },
+    rules: {
+      'no-unused-vars': 'warn',
     },
-  ],
-};
-try {
-  require('webpack');
-  config.settings['import/resolver'] = {
+  },
+  generalRules,
+];
+if (isInstalled('webpack')) {
+  generalRules.settings['import/resolver'] = {
     webpack: {},
   };
-  // eslint-disable-next-line no-empty
-} catch (e) {}
-module.exports = config;
+}
+export default config;
diff --git a/packages/eslint-plugin/index.js b/packages/eslint-plugin/index.js
@@ -1,6 +1,9 @@
-module.exports = {
+import javascript from './base.js';
+import typescript from './typescript.js';
+
+export default {
   configs: {
-    typescript: require('./typescript'),
-    javascript: require('./base'),
+    typescript,
+    javascript,
   },
 };
diff --git a/packages/eslint-plugin/isInstalled.cjs b/packages/eslint-plugin/isInstalled.cjs
@@ -0,0 +1,7 @@
+module.exports = function isInstalled(pkgName) {
+  try {
+    return require.resolve(pkgName);
+  } catch {
+    return false;
+  }
+};