eslint代码风格检查工具

[xwjie]

安装

不建议全局安装

npm i -D eslint

配置

执行 eslint --init

? How would you like to configure ESLint?
Answer questions about your style

Use a popular style guide
Inspect your JavaScript file(s)

然后选择风格

? Which style guide do you want to follow? (Use arrow keys)
Google

Airbnb
Standard

? What format do you want your config file to be in? (Use arrow keys)

JavaScript
YAML
JSON

这里我们使用 airbnb 的。

手工安装flow等依赖

npm install babel-eslint eslint-plugin-flowtype --save-dev

自定义规则

.eslintrc.json 中增加rule，如

"rules": {
        "linebreak-style": 0
    }

更多规则参考 这里

忽略检查

• 对于文件/文件夹，配置在 .eslintignore 文件中
• 对于代码块，使用 /* eslint-disable / 和 / eslint-enable */
• 对于代码行，使用 /* eslint-disable-line rule1, rule2 */

最终配置文件 .eslintrc.json

{
    "extends": [
        "plugin:flowtype/recommended",
        "airbnb-base"
    ],
    "plugins": [
        "flowtype"
    ],
    "rules": {
        "linebreak-style": 0
    }
}

增加 npm 脚本

 "test": "npm run lint && flow check",
 "lint": "eslint src"

也可以使用pre钩子让每次编译前检查。