Merge pull request #26 from twentyideas/eslint-v9

Eslint v9

.husky/pre-commit

@@ -1,14 +1,2 @@
-#!/bin/sh
-. "$(dirname "$0")/_/husky.sh"
-
-export NVM_DIR="$HOME/.nvm"
-[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"
-# if nvm is installed, use it
-
-if [ -n "$(command -v nvm)" ]; then
-  nvm use
-else
-  echo >&2 "nvm is recommended, but it's not installed. Consider installing: https://github.com/nvm-sh/nvm - Using system node version"
-fi
 corepack enable
 yarn lint-staged --allow-empty

.nvmrc

@@ -1 +1 @@
-18
+22

.yarnrc.yml

@@ -4,4 +4,4 @@ enableGlobalCache: false
 
 nodeLinker: node-modules
 
-yarnPath: .yarn/releases/yarn-4.0.2.cjs
+yarnPath: .yarn/releases/yarn-4.4.1.cjs

README.md

@@ -3,107 +3,152 @@
 [![publish](https://github.com/twentyideas/eslint-config-20i/actions/workflows/publish.yml/badge.svg)](https://github.com/twentyideas/eslint-config-20i/actions/workflows/publish.yml)
 ![npm (scoped)](https://img.shields.io/npm/v/@20i/eslint-config)
 
-## Auto Install
+## Usage
+
+```js
+import { baseConfig, reactConfig } from "@20i/eslint-config"
+import pluginQuery from "@tanstack/eslint-plugin-query"
+import tsEslint from "typescript-eslint"
+
+export default tsEslint.config(
+  {
+    // global ignores
+    ignores: ["**/generated/**/*"],
+  },
+  {
+    files: ["**/*.{js,jsx,ts,tsx}"],
+    extends: [
+      // 20i configs
+      ...baseConfig,
+      ...reactConfig,
+      // other configs
+      ...pluginQuery.configs["flat/recommended"],
+    ],
+    // for type aware linting
+    languageOptions: {
+      parserOptions: {
+        projectService: true,
+      },
+    },
+    // custom rules
+    rules: {
+      "react/prop-types": "off",
+      "no-debugger": "warn",
+    },
+  },
+  // scoped rules
+  {
+    files: ["./packages/app/src/**/*.{js,jsx,ts,tsx}"],
+    rules: {
+      "@typescript-eslint/switch-exhaustiveness-check": "error",
+    },
+  }
+)
+```
+
+## Configure VS Code
+
+[1]: https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
+[2]: https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
+
+1. Make sure these extensions are installed:
+
+   - [ESlint][1]
+   - [Prettier - Code formatter][2]
+   - Install from the links above or _via terminal:_
+
+   ```sh
+   code --install-extension dbaeumer.vscode-eslint && \
+   code --install-extension esbenp.prettier-vscode
+   ```
+
+2. Add the following to your global `~/.vscode/settings.json` file:
+
+   ```jsonc
+   {
+     "editor.codeActionsOnSave": {
+       "source.fixAll": true,
+     },
+     // format on save for everything, but what prettier will handle through eslint
+     "editor.formatOnSave": true,
+     "[javascriptreact]": {
+       "editor.formatOnSave": false,
+     },
+     "[javascript]": {
+       "editor.formatOnSave": false,
+     },
+     "[typescript]": {
+       "editor.formatOnSave": false,
+     },
+     "[typescriptreact]": {
+       "editor.formatOnSave": false,
+     },
+   }
+   ```
+
+3. Restart VS Code
+
+## References
+
+Inspired heavily by [eslint-config-wesbos](https://github.com/wesbos/eslint-config-wesbos)
+
+---
+
+## Legacy docs (config < 4, eslint < 9)
+
+### Auto Install
 
 Use `mrm` to install all dependencies and add config files.
 
 ```sh
 npx mrm eslint --preset @20i/mrm-preset
 ```
 
-## Manual Install
+### Manual Install
 
 1. Install dev dependencies:
 
-    ```sh
-    yarn add -D eslint prettier typescript @20i/eslint-config
-    # or
-    npm i -D eslint prettier typescript @20i/eslint-config
-    ```
+   ```sh
+   yarn add -D eslint prettier typescript @20i/eslint-config
+   # or
+   npm i -D eslint prettier typescript @20i/eslint-config
+   ```
 
 2. Create a new file, `.eslintrc.js`, in the directory of your project.
 3. Add the following code to the file.
 
-    ```js
-    module.exports = {
-      extends: ["@20i/eslint-config"],
-      parserOptions: {
-        project: ["./tsconfig.eslint.json"],
-      },
-      ignorePatterns: [],
-    }
-    ```
+   ```js
+   module.exports = {
+     extends: ["@20i/eslint-config"],
+     parserOptions: {
+       project: ["./tsconfig.eslint.json"],
+     },
+     ignorePatterns: [],
+   }
+   ```
 
-    ⚠️ _**For React projects**, set `@20i/eslint-config/react` instead._
+   ⚠️ _**For React projects**, set `@20i/eslint-config/react` instead._
 
 4. Add a special `tsconfig.json` file to your project: `tsconfig.eslint.json`
 
-    ```jsonc
-    {
-      // extend your base config to share compilerOptions, etc
-      "extends": "./tsconfig.json",
-      "compilerOptions": {
-        // ensure that nobody can accidentally use this config for a build
-        "noEmit": true
-      },
-      "include": [
-        "**/*",
-        "**/.*"
-      ],
-    }
-    ```
+   ```jsonc
+   {
+     // extend your base config to share compilerOptions, etc
+     "extends": "./tsconfig.json",
+     "compilerOptions": {
+       // ensure that nobody can accidentally use this config for a build
+       "noEmit": true,
+     },
+     "include": ["**/*", "**/.*"],
+   }
+   ```
 
 5. Add the following to your `.prettierrc` file:
 
-    ```json
-    {
-      "endOfLine": "auto",
-      "semi": false,
-      "trailingComma": "es5"
-    }
-    ```
-
-## Configure VS Code
-
-[1]: https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
-[2]: https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
-
-1. Make sure these extensions are installed:
-   - [ESlint][1]
-   - [Prettier - Code formatter][2]
-   - Install from the links above or _via terminal:_  
-
-    ```sh
-    code --install-extension dbaeumer.vscode-eslint && \
-    code --install-extension esbenp.prettier-vscode
-    ```
-
-2. Add the following to your global `~/.vscode/settings.json` file:
-
-    ```jsonc
-    {
-      "editor.codeActionsOnSave": {
-        "source.fixAll": true
-      },
-      // format on save for everything, but what prettier will handle through eslint
-      "editor.formatOnSave": true,
-      "[javascriptreact]": {
-        "editor.formatOnSave": false,
-      },
-      "[javascript]": {
-        "editor.formatOnSave": false,
-      },
-      "[typescript]": {
-        "editor.formatOnSave": false,
-      },
-      "[typescriptreact]": {
-        "editor.formatOnSave": false,
-      },
-    }
-    ```
-
-3. Restart VS Code
-
-## References
-
-Inspired heavily by [eslint-config-wesbos](https://github.com/wesbos/eslint-config-wesbos)
+   ```json
+   {
+     "endOfLine": "auto",
+     "semi": false,
+     "trailingComma": "es5"
+   }
+   ```

eslint.config.js

@@ -0,0 +1,47 @@
+// @ts-check
+
+import globals from "globals"
+import eslint from "@eslint/js"
+import tsEslint from "typescript-eslint"
+import eslintPluginPrettierRecommended from "eslint-plugin-prettier/recommended"
+
+export default tsEslint.config(
+  eslint.configs.recommended,
+  ...tsEslint.configs.strictTypeChecked,
+  ...tsEslint.configs.stylisticTypeChecked,
+  eslintPluginPrettierRecommended,
+  {
+    ignores: ["./.yarn/**/*"],
+  },
+  {
+    rules: {
+      "@typescript-eslint/interface-name-prefix": "off",
+      "@typescript-eslint/explicit-function-return-type": "off",
+      "@typescript-eslint/explicit-module-boundary-types": "off",
+      "@typescript-eslint/no-explicit-any": "off",
+      "no-shadow": "off",
+      "@typescript-eslint/no-shadow": "error",
+
+      "@typescript-eslint/no-unused-vars": [
+        "warn",
+        {
+          argsIgnorePattern: "^_",
+          varsIgnorePattern: "^_",
+          caughtErrorsIgnorePattern: "^_",
+        },
+      ],
+
+      "@typescript-eslint/consistent-type-exports": "error",
+      "@typescript-eslint/no-import-type-side-effects": "error",
+      "@typescript-eslint/consistent-type-imports": "error",
+    },
+    languageOptions: {
+      globals: {
+        ...globals.node,
+      },
+      parserOptions: {
+        project: true,
+      },
+    },
+  }
+)

index.d.ts

@@ -0,0 +1,4 @@
+import type { Linter } from "eslint"
+
+declare const config: Linter.Config[]
+export default config

index.js

@@ -1,6 +1,3 @@
-/* eslint-disable @typescript-eslint/no-unsafe-call */
-/* eslint-disable @typescript-eslint/no-var-requires */
+import baseConfig from "./eslint.config.js"
 
-const eslintrc = require("./.eslintrc")
-
-module.exports = eslintrc
+export default baseConfig