ESLint を試す

ES6をサポートしているjsのlinterです。
普段はJSHint を使っていましたが、
Chrome Extensionの開発にES6 が使えるということに気づいたので
ES6で書き直す際に Linterも ESLint を利用してみました。

ご参考

・ESLint 最初の一歩 - Qiita
・ES6
　

Install

npm install -g eslint

Settings

eslint --init

これで対話形式で、eslintの設定ファイル .eslintrcを作成することができます。

$ eslint --version
v2.3.0

$ eslint --init
? How would you like to configure ESLint? Answer questions about your style
? Are you using ECMAScript 6 features? Yes
? Are you using ES6 modules? No
? Where will your code run? Browser
? Do you use CommonJS? No
? Do you use JSX? No
? What style of indentation do you use? Spaces
? What quotes do you use for strings? Single
? What line endings do you use? Unix
? Do you require semicolons? Yes
? What format do you want your config file to be in? JSON
Successfully created .eslintrc.json file in /private/tmp/d

$ cat .eslintrc.json
{
    "env": {
        "browser": true,
        "es6": true
    },
    "extends": "eslint:recommended",
    "rules": {
        "indent": [
            "error",
            4
        ],
        "linebreak-style": [
            "error",
            "unix"
        ],
        "quotes": [
            "error",
            "single"
        ],
        "semi": [
            "error",
            "always"
        ]
    }
}

最終的には

jasmineを使うので、envに追加。
chromeのAPI用にglobalsに追加。
indentはsofttab 2でwarnに変更。

{
  "env": {
    "browser": true,
    "es6": true,
    "jasmine": true
  },
  "extends": "eslint:recommended",
  "globals": {
    "chrome": false,
    "module": false,
    "process": false
  },
  "rules": {
    "indent": ["warn", 2],
    "linebreak-style": [
      "error",
      "unix"
    ],
    "semi": [
      "error",
      "always"
    ]
  }
}

感想

お手軽かつ、praggableで良いです。
Atom Editorを利用していますが、速度も今のところ気になりません。
Atom Editorだとjshintとの併用がしにくいのが難点なぐらい。