@mizdra/eslint-config-mizdra

eslint-config-mizdra

ESLint config for @mizdra

インストール

npm i -D @mizdra/eslint-config-mizdra eslint

使い方

flat config から使う場合

// @ts-check
import mizdra from '@mizdra/eslint-config-mizdra';

/** @type {import('eslint').Linter.Config[]} */
export default [
  { ignores: ['**/dist'] },
  ...mizdra.baseConfigs,
  ...mizdra.typescriptConfigs,
  ...mizdra.nodeConfigs,
  ...mizdra.reactConfigs,
  {
    files: ['**/*.{js,jsx,mjs,cjs}', '**/*.{ts,tsx,cts,mts}'],
    rules: {
      // Write your favorite rules
    },
  },
  mizdra.prettierConfig,
];

legacy config から使う場合

@mizdra/eslint-config-mizdra@5.0.0 から Legacy Config サポートが削除されました。Legacy Config を使いたい場合は、@mizdra/eslint-config-mizdra@^4.0.0 を使ってください。

組み込みの 3rd-party packages

利便性のため、eslint-config-mizdra は以下の ESLint Plugins を dependencies としてインストールします。そのため、eslint-config-mizdra を利用するプロジェクトの devDependencies にこれらを追加する必要はありません。

• @typescript-eslint/eslint-plugin
• eslint-plugin-n
• eslint-plugin-react
• eslint-plugin-react-hooks
• eslint-plugin-simple-import-sort

その他にもいくつかのパッケージを dependencies としてインストールしています。詳しくは package.json の dependencies フィールドを参照してください。

インストールされるバージョンは、eslint-config-mizdra をインストールした時点で最も最新のものです。一度インストールされると、package-lock.json などによりバージョンが固定されます。最新のバージョンにアップデートする方法や、好きなバージョンに固定する方法は、「よくある質問」を参照してください。

利用可能な config

baseConfigs

基本的な rule をまとめた config です。

// @ts-check
import mizdra from '@mizdra/eslint-config-mizdra';

/** @type {import('eslint').Linter.Config[]} */
export default [...mizdra.baseConfigs];

typescriptConfigs

TypeScript 向けの config です。

// @ts-check
import mizdra from '@mizdra/eslint-config-mizdra';

/** @type {import('eslint').Linter.Config[]} */
export default [
  ...mizdra.baseConfigs,
  ...mizdra.typescriptConfigs,
  {
    files: ['**/*.{ts,tsx,cts,mts}'],
    rules: {
      // TypeScript 向けのプロジェクト固有のルールをここに書く
    },
  },
];

nodeConfigs

Node.js で実行されるコード向けの config です。利用するには、eslint-plugin-n のドキュメントに従って Node.js のバージョンを指定しておく必要があります。

// @ts-check
import mizdra from '@mizdra/eslint-config-mizdra';

/** @type {import('eslint').Linter.Config[]} */
export default [...mizdra.baseConfigs, ...mizdra.nodeConfigs];

// package.json
{
  "name": "your-module",
  "version": "1.0.0",
  "engines": {
    "node": ">=16.0.0" // required
  }
}

reactConfigs

React を使っているコード向けの config です。

// @ts-check
import mizdra from '@mizdra/eslint-config-mizdra';

/** @type {import('eslint').Linter.Config[]} */
export default [...mizdra.baseConfigs, ...mizdra.reactConfigs];

prettierConfig

Prettier を使っているコード向けの config です。config list の最後に設定することを想定しています。

// @ts-check
import mizdra from '@mizdra/eslint-config-mizdra';

/** @type {import('eslint').Linter.Config[]} */
export default [
  { ignores: ['**/dist'] },
  ...mizdra.baseConfigs,
  ...mizdra.typescriptConfigs,
  {
    // Write your favorite configs
  },
  mizdra.prettierConfig,
];

よくある質問

組み込みの 3rd-party packages をアップデートするには?

一度 eslint-config-mizdra をアンインストールしてから再度インストールしてください。組み込みの 3rd-party packages が最新のバージョンに切り替わります。

npm un @mizdra/eslint-config-mizdra
npm i -D @mizdra/eslint-config-mizdra

組み込みの 3rd-party packages を好きなバージョンに固定するには?

npm と pnpm では、package.json の overrides フィールドを使って、組み込みの 3rd-party packages を好きなバージョンにできます。yarn では、package.json の resolutions フィールドを使って、組み込みの 3rd-party packages のバージョンを固定できます。

• https://docs.npmjs.com/cli/v8/configuring-npm/package-json#overrides
• https://yarnpkg.com/configuration/manifest/#resolutions
• https://pnpm.io/ja/package_json#pnpmoverrides

// package.json
{
  "overrides": {
    "typescript-eslint": "^8.5.0"
  }
}