ESLint:npm initで設定ファイル(.eslintrc)を作成する方法

スポンサーリンク

npm initで設定ファイル(.eslintrc)を作成する方法

npm initで設定ファイル(.eslintrc)を作成するには以下のようにします。

 

$ npm install eslint --save-dev  # eslintのインストール

$ npm init @eslint/config  # .eslintrcを作成する
$ # シンタックスチェックだけでよいかなどを選択
? How would you like to use ESLint? … 
  To check syntax only
▸ To check syntax and find problems
  To check syntax, find problems, and enforce code style

$ # 使用しているモジュールを選択
? What type of modules does your project use? … 
▸ JavaScript modules (import/export)
  CommonJS (require/exports)
  None of these

$ # 使用しているフレームワークを選択
? Which framework does your project use? … 
▸ React
  Vue.js
  None of these

$ # TypeScriptを使用する場合はYes
? Does your project use TypeScript? ‣ No / Yes

$ # 実行する環境を選択。複数選択可能
? Where does your code run? …  (Press <space> to select, <a> to toggle all, <i> to invert selection)
✔ Browser
✔ Node

$ # .eslintrcファイルの形式を選択
? What format do you want your config file to be in? … 
  JavaScript
  YAML
▸ JSON

The config that you've selected requires the following dependencies:

eslint-plugin-react@latest @typescript-eslint/eslint-plugin@latest @typescript-eslint/parser@latest
$ # パッケージをインストールする場合はYes
? Would you like to install them now with npm? ‣ No / Yes 

$ npx eslint yourfile.js  # eslintの実行

 

上記を実行すると、以下のような.eslintrcファイルが作成される。

$ cat .eslintrc.json
{
    "env": {
        "browser": true,
        "es2021": true,
        "node": true
    },
    "extends": [
        "eslint:recommended",
        "plugin:react/recommended",
        "plugin:@typescript-eslint/recommended"
    ],
    "parser": "@typescript-eslint/parser",
    "parserOptions": {
        "ecmaFeatures": {
            "jsx": true
        },
        "ecmaVersion": "latest",
        "sourceType": "module"
    },
    "plugins": [
        "react",
        "@typescript-eslint"
    ],
    "rules": {
    }
}