1. 安装eslint

cnpm i eslint D

2. 编辑器安装eslint插件

3. 在根目录下编写 .eslintrc.js、 .eslintignore

.eslintrc.js

module.exports = {
    parser: 'babel-eslint',
    extends: 'standard',
    rules: {
      'semi':['error','always']
    }
}

.eslintignore

node_modules/
.vscode/
dist/
.git/

4. 安装依赖

cnpm i babel-eslint eslint-config-standard 
eslint-plugin-standard eslint-plugin-promise eslint-plugin-import eslint-plugin-node -D

上面为什么要装第二行的那些依赖， 你可以到 npm中查看，这些依赖是对 eslint-config-standard的支持

5. 安装 husky, 这是git提交前的钩子，可以在commit前执行一些命令

cnpm i husky -D

6. 在package.json 中编写执行脚本

"lint": "eslint --ext .js ./",
"precommit": "npm run lint"

7. 在执行git commit -m "" 时会自动执行package.json 中的 "lint" 脚本命令，对代码进行检查， 这时肯定会报大量的错误， 一个一个的打开 *.js 文件， 因为我们已经在编辑器中安装了 eslint插件， 不符合规范的代码会有红色波浪线提醒，根据提示修改代码， 直到所有代码均满足规范才能提交git 仓库， 如果你也是使用 vscode编辑器， 执行快捷键 shift + alt + 'f' 会修复大量的不规范代码。。。 但是， 我们在client/ 使用的是React 的 jsx 语法， 应该使用相应的eslint规范才行， 我们这里使用的是 airbnb

8. 安装airbnb及相关依赖

cnpm install --save-dev eslint-config-airbnb eslint-plugin-jsx-a11y eslint-plugin-import eslint-plugin-react -D

9. 新建 client/.eslintrc.js 文件

module.exports = {
  extends: 'airbnb',
  parser: 'babel-eslint',
  env: {
    'browser': true,
    'node': true,
    'es6': true,
  },
  'parserOptions': {
    'ecmaVersion': 6,
    'sourceType': 'module',
    'ecmaFeatures': {
      'jsx': true
    }
  },
  rules: {

  }
}

10. 更改package.json 中的 "lint"脚本： "lint": "eslint --ext .js ./ && eslint --ext .js, .jsx client/",

11. 再次提交 git commit -m "airbnb", 这次会报关于 jsx语法的错误， 根据编辑器提示修改， 如果有一些报错觉得太严格，我们也可以把该eslint规范关闭掉：

rules: {
    'react/jsx-filename-extension': [0] // 不允许在js文件中编写jsx
  }

上面我们说了在提交时进行eslint代码检查， 那么在开发过程，我们也需要实时知道报错信息，以便及时修复

1. 安装webpack的eslint解析器 eslint-loader

cnpm i eslint-loader -D

2. 同时编辑 build/webpack.config.js build/webpack.server.js 这样可以在webpack-dev-server环境下以及使用webpack 打包线上代码时 进行client目录的eslint代码检查:

module.rules

{
  enforce: 'pre', // 执行webpack时优先执行
  test: /.(js|jsx)$/i,
  loader: 'eslint-loader',
  exclude: path.join(__dirname, '../node_modules')
},

3.可以尝试修改client下的代码，使其不符合 airbnb标准， 这样在打包 或者 webpack-dev-server开发环境，就会及时保错了，（如，去掉App.jsx中的分号，然后开启webpack-dev-server环境）

npm run devc

出现了下面的错误提示：