基于eslint的代码规则,具体规则详见eslint-config-airbnb源码

配置方法:

  • 安装eslint-loader
npm install --save-dev eslint-loader
  • 安装eslint
npm install --save-dev eslint
  • webpack.config.js下添加代码
{
test: /\.jsx?$/,
loader: 'eslint-loader',
enforce: "pre",
include: [path.resolve(__dirname, 'src')], // 指定检查的目录
options: { // 这里的配置项参数将会被传递到 eslint 的 CLIEngine
formatter: require('eslint-friendly-formatter') // 指定错误报告的格式规范
}
}
  • 第四步:新建配置文件.eslintrc.js
module.exports = {
"parser": "babel-eslint",
"extends": "airbnb",
"rules": {
"import/no-extraneous-dependencies": "off",
"import/no-unresolved": "off",
},
globals: {
APP_TYPE: true,
},
"env": {
"browser": true,
"node": true,
},
};
  • 第五步:在package.json中添加
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"build": "node build/build.js",
"lint": "eslint --ext .js,.jsx src",//添加此行
"precommit": "lint-staged"
},
  • 第六步:配置Airbnb校验规则及其依赖
npm install eslint-plugin-jsx-a11y --save
npm install eslint-plugin-react --save
npm install eslint-plugin-import --save
npm install --save-dev eslint-config-airbnb
  • 第七步:在配置文件.eslintrc.js中添加
extends: 'airbnb',