共有設定でらくらく ESLint

  • 89
    いいね
  • 0
    コメント
この記事は最終更新日から1年以上が経過しています。

ESLint はデフォルトでは何も警告してくれず、しかも膨大な設定項目があるために使い始めが大変です。

ところで、ESLint は共有設定という仕組みを持っていて、誰でも "自分の設定" を共有することができます。
そして、使いはじめる人は共有された設定を使って簡単に ESLint を使い始めることができます。
共有設定の一部が気に入らなかった場合には、(設定ファイルを書いて) そこだけ自分好みに上書きできます。

この記事では、有名な共有設定を紹介していきます。

eslint-config-eslint

ESLint 自身が使っている設定です。
インデント幅が 4 だったり、文字列がダブルクォーテーションだったりとオーナーの趣味が出ています。
私は好きです。

shell
> npm install -g eslint eslint-config-eslint
> eslint -c eslint your-code.js

または

package.json
{
  "devDependencies": {
    "eslint": "^2.0.0",
    "eslint-config-eslint": "^3.0.0"
  },
  "scripts": {
      "lint": "eslint -c eslint your-code.js"
  }
}
shell
> npm install
> npm run lint

eslint-config-google

Google JavaScript Style Guide のための設定です。
GitHub の Google リポジトリにあります。

shell
> npm install -g eslint eslint-config-google
> eslint -c google your-code.js

または

package.json
{
  "devDependencies": {
    "eslint": "^2.0.0",
    "eslint-config-google": "^0.4.0"
  },
  "scripts": {
      "lint": "eslint -c google your-code.js"
  }
}
shell
> npm install
> npm run lint

eslint-config-airbnb

Airbnb JavaScript Style Guide (日本語訳) のための設定です。
いち早く ECMAScript 2015 に対応したスタイルガイドを作成したため、人気があります。

shell
> npm install -g eslint eslint-config-airbnb eslint-plugin-react
> eslint -c airbnb your-code.js

または

package.json
{
  "devDependencies": {
    "eslint": "^2.0.0",
    "eslint-config-airbnb": "^6.0.0",
    "eslint-plugin-react": "^4.1.0"
  },
  "scripts": {
      "lint": "eslint -c airbnb your-code.js"
  }
}
shell
> npm install
> npm run lint

eslint-config-standard

セミコロン書かない派の急先鋒です。
「俺こそが標準だ!」という意気込みを感じる名前ですね。

shell
> npm install -g eslint eslint-config-standard eslint-plugin-standard eslint-plugin-promise
> eslint -c standard your-code.js

または

package.json
{
  "devDependencies": {
    "eslint": "^2.0.0",
    "eslint-config-standard": "^5.0.0",
    "eslint-plugin-standard": "^1.3.2",
    "eslint-plugin-promise": "^1.0.8"
  },
  "scripts": {
      "lint": "eslint -c standard your-code.js"
  }
}
shell
> npm install
> npm run lint

eslint-config-mysticatea

そして有名ドコロに混ぜで自分の設定も晒してみます。

shell
> npm install -g eslint eslint-config-mysticatea
> eslint -c mysticatea your-code.js

または

package.json
{
  "devDependencies": {
    "eslint": "^2.0.0",
    "eslint-config-mysticatea": "^2.0.0"
  },
  "scripts": {
      "lint": "eslint -c mysticatea your-code.js"
  }
}
shell
> npm install
> npm run lint

See Also: