使用eslint-config-airbnb来规范JavaScript编写风格

JavaScript

Airbnb JavaScript Style Guide是非常赞的JavaScript风格指南（GitHub star 4.7w）,能够使工程师写出非常优雅的JavaScript代码，但习惯的养成是个非常漫长的过程，那么多的规则背下来也不是那么容易的事，如何能够在不影响效率的情况下方便的养成良好的编码习惯呢？
eslint-config-airbnb代码检查插件可以很好的帮助工程师检查代码，如果代码不符合Airbnb的风格要求就会有错误提示。

安装eslint-config-airbnb

eslint-config-airbnb
eslint
eslint-plugin-import
eslint-plugin-react
eslint-plugin-jsx-a11y

在项目目录下新建.eslintrc文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
{
  "extends": "airbnb",
  "parser": "babel-eslint",
  "env": {
    "browser": true,
    "node": true,
    "mocha": true
  },
  "rules": {
    // Disable for __DEV__, __SERVER__ usage.
    "no-undef" : 0,

    // Disable for console/alert
    "no-console": 0,
    "no-alert": 0,
    "object-curly-spacing": [2, "never"],
    "react/jsx-indent": 0,
    "react/jsx-filename-extension": 0,
    "indent": [2, 4, {"SwitchCase": 1}]
  },
  "plugins": [
    "react", "import"
  ],
  "settings": {
    "import/parser": "babel-eslint",
    "import/resolve": {
      "moduleDirectory": ["node_modules", "src"]
    }
  },
  "globals": {
    "__DEV__": true
  }
}

启动ESLint

WebStorm->File->Setting->Eslint->Enable