ESLint設定ジェネレータ
ESLint設定ファイル(モダンなflat config(eslint.config.js)またはレガシー.eslintrc.json)を、フレームワークプリセット(Vanilla、Node、React、Next.js、Vue、TypeScript)、オプションのスタイルガイド(Airbnb、Standard、Google、Prettier)、言語オプション、環境、および一般的なルールの切り替えから生成します。
入力
Flat configはESLint v9以降のデフォルトです。レガシーはv8に留まっているプロジェクト向けです。
スタックに適切なパーサー、プラグイン、ベースルールを選択します。
ベースの後に拡張される共有設定。Prettierは最後に追加する必要があります。
言語オプション
パーサーが受け入れるJavaScript構文バージョン。
ファイルをどのように解析するか。
環境
一般的なルール
出力オプション
出力
このツールを使う他の方法
REST API
curl -X POST https://api.iotools.cloud/v1/tool/eslint-config-generator \
-H "Authorization: Bearer YOUR_API_KEY" \
-H "Content-Type: application/json" \
-d '{
"format": "flat",
"framework": "vanilla",
"styleGuide": "none",
"useTypescript": "",
"ecmaVersion": "latest",
"sourceType": "module",
"envBrowser": "true",
"envNode": "",
"envJest": "",
"envMocha": "",
"ruleSemi": "error",
"ruleQuotes": "single",
"ruleIndent": "2",
"ruleNoUnusedVars": "warn",
"ruleNoConsole": "warn",
"ruleEqeqeq": "error",
"rulePreferConst": "error",
"ruleNoVar": "error",
"includeComments": "true",
"includeHeader": "true",
"includeInstall": "true"
}'ご自身のアカウントのキーに差し替えてください。ツールのフィールドがそのままリクエストボディになります——ラッパーはありません。
AIエージェントに依頼する
Use the IOTools `eslint-config-generator` tool (ESLint Config Generator) on this input:
YOUR_INPUT_HEREIOTools MCPサーバーに接続された任意のエージェントにこれを貼り付け、入力内容を追加してください。
埋め込みウィジェット
<iframe
src="https://iotools.cloud/embed/eslint-config-generator/"
width="100%" height="520" frameborder="0" scrolling="no" loading="lazy"
title="ESLint設定ジェネレータ — iotools.cloud"
sandbox="allow-scripts allow-forms allow-same-origin allow-downloads allow-popups allow-popups-to-escape-sandbox"
allow="clipboard-write"
style="width:100%;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden"></iframe>
<script src="https://iotools.cloud/embed.js" async></script>ご自身のページに貼り付けるだけ——無料、キー不要、リンクを掲載するだけです。
| API/MCP 1回あたりの費用 | 5クレジットから |
|---|---|
| クレジットが足りませんか? | 料金を見る |
次の方法でも利用可能
ガイド
ESLint設定ジェネレータは、いくつかのドロップダウンとトグルから使用可能なESLint設定ファイルを構築します——プラグイン名、extendsの順序、またはモダンなflat configとレガシー形式の違いを暗記する必要はありません。フレームワークを選択し、オプションのスタイルガイドを選択し、気になるルールを選択して、生成されたファイルをプロジェクトに直接コピーします。
これが行うこと
ESLintはJavaScriptとTypeScriptの標準的なlinterですが、configを手動でセットアップすることは、パーサー、プラグイン、環境、および共有可能な設定を正しい順序で処理することを意味します。このツールはそのすべてをあなたのために組み立てます。これは以下をサポートします:
- 2つの出力形式 ——flat config(
eslint.config.js、ESLint v9以降のデフォルト)およびレガシー(.eslintrc.json、v8に留まっているプロジェクト用)。 - フレームワークプリセット ——Vanilla JavaScript、Node.js、React、Next.js、Vue 3、およびTypeScript(汎用)、各々が正しいプラグインとbase
extendsを備えています。 - スタイルガイド ——Airbnb、Standard、Google、およびPrettier(最後に追加されるため、競合するフォーマットルールをオフにすることができます)。
- 言語オプション ——
ecmaVersionおよびsourceType(ESM、CommonJS、またはscript)。 - 環境 ——ブラウザ、Node、Jest、およびMochaグローバル変数。
- 一般的なルール ——
semi、quotes、indent、no-unused-vars、no-console、eqeqeq、prefer-const、およびno-var、各々がerror、warn、またはoffに個別に設定できます。
また、説明的なヘッダーコメント、各ブロックを説明するインラインコメント、および設定が依存するすべてのパッケージを一覧表示する正確なnpm install -D …コマンドを追加することもできます。
使用方法
- 設定形式を選択します(新規プロジェクトではflatが推奨されます)。
- フレームワークを選択し、オプションでスタイルガイドを選択します。
- プロジェクトが
@typescript-eslintを使用している場合はTypeScriptを使用をトグルします。 - 言語オプション、環境、および一般的なルールの重大度を調整します。
- 生成された設定をコピーするか、ダウンロードしてから、表示されるinstallコマンドを実行します。
任意のオプションを変更すると、出力は瞬時に更新されます。
Flat configとレガシー configのどちらを選ぶべき?
ESLint v9以上のプロジェクトにはflat config(eslint.config.js)を使用します。これは現在のデフォルトであり、すべての将来の開発がこちらに向かっています。ESLint v8に固定されている場合、またはまだ移行していないツールチェーンのみレガシー(.eslintrc.json)を使用してください。
それでもパッケージをインストールする必要がありますか?
はい。ツールは設定テキストと対応するinstallコマンドを生成しますが、何もインストールしません。生成されるnpm install -D …行(またはyarn/pnmと同等のもの)を実行して、ESLintが参照されるプラグインと共有可能な設定を見つけられるようにしてください。
Prettierが別途リストされているのはなぜですか?
eslint-config-prettierはESLintのフォーマットルールを無効化するだけで、フォーマッターと競合しないようにします——独自のルールは追加されません。そのため、最後に適用する必要があり、これはジェネレータが配置する場所とまったく同じです。
後でルールを微調整できますか?
もちろんです。生成されたファイルは通常の出発点です——ルールの重大度を編集したり、さらにルールを追加したり、追加の設定で拡張したりしてください。出力を固い基盤として扱い、ロックされた結果ではなく。
プライバシー
このジェネレータはブラウザ内で完全に実行されます。選択内容は決してアップロード、ログ、または保存されません——設定はあなたが選択したオプションからローカルで組み立てられ、デバイスから何も出ません。