第一步:安装eslint-loader
npm install --save-dev eslint-loader
第二步:安装eslint
npm install --save-dev eslint
第三步:webpack.config.js下添加代码
{
test: /\.js$/,
loader: 'eslint-loader',
enforce: "pre",
include: [path.resolve(__dirname, 'src')], // 指定检查的目录
options: { // 这里的配置项参数将会被传递到 eslint 的 CLIEngine
formatter: require('eslint-friendly-formatter') // 指定错误报告的格式规范
}
}
第四步:新建配置文件.eslintrc.js
module.exports = {
root: true,
parserOptions: {
sourceType: 'module'
},
env: {
browser: true,
},
rules: {
"indent": ["error", 2],
"quotes": ["error", "double"],
"semi": ["error", "always"],
"no-console": "error",
"arrow-parens": 0
}
}
第五步:在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,.vue src",//添加此行
"test": "npm run lint"//添加此行
},
现在就可以用以上代码中rules的规则对代码进行校验了,如果还要使用airbnb的规则,则继续安装。
第六步:配置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',