ESlint-airbnb配置

ESlint 配置

eslit-aribnb安装地址https://www.npmjs.com/package/eslint-config-airbnb

安装

MAC安装方法，windows见以上网址

(
  export PKG=eslint-config-airbnb;
  npm info "$PKG@latest" peerDependencies --json | command sed 's/[\{\},]//g ; s/: /@/g' | xargs npm install --save-dev "$PKG@latest"
)

安装内容如下

+ eslint-plugin-react@7.4.0
+ eslint@4.11.0
+ eslint-plugin-import@2.8.0
+ eslint-plugin-jsx-a11y@6.0.2
+ eslint-config-airbnb@16.1.0

初始化配置

eslint --init

之后会提示选择

? How would you like to configure ESLint? (Use arrow keys)
❯ Answer questions about your style
  Use a popular style guide
  Inspect your JavaScript file(s)

选择第二项

? How would you like to configure ESLint? Use a popular style guide
? Which style guide do you want to follow? (Use arrow keys)
❯ Google
  Airbnb
  Standard

选择Airbnb标准

? Do you use React? (y/N)

有没有使用React，没有就选N

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

配置文件以哪种形式保存，选择JSON

? The style guide "airbnb" requires eslint@^4.9.0. You are currently using eslint@
4.3.0.
  Do you want to upgrade? (Y/n)

检查eslint使用版本，是否更新
推荐使用npm 安装，若安装较慢，切换淘宝源即可。

npm config set registry 'https://registry.npm.taobao.org'

若之前使用cnpm安装package.json中的内容，之后在上一步更新使用npm更新，会导致出错，最好都是用npm安装，前后保持一致。

配置成功

最后会自动创建eslint配置文件.eslintrc.json

{
    "extends": "airbnb-base"
}

编辑器配置

webstorm在Preference中搜ESLint配置

配置成功后，在代码中会出现提示