eslint配置(使用Airbnb编码规则)

第一步:安装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',

你可能感兴趣的:(eslint配置(使用Airbnb编码规则))