webpack配置eslint检查

webpack.config.js

const {resolve} = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
    entry: './src/js/index.js',
    output: {
        filename: 'js/build.js',
        path: resolve(__dirname, 'build')
    },
    module: {
        rules: [
            /**
             * 语法检查: eslint-loader eslint
             * 注意: 只检查写的代码,第三方的代码库是不检查的
             * 设置检查规则:
             *  package.json中eslintConfig中设置
             *  "eslintConfig": {
             *      "extends": "airbnb-base"
             *   }
             *  airbnb --> eslint-config-airbnb-base eslint-plugin-import eslint
             */
            {
                test: /\.js$/,
                loader: 'eslint-loader',
                options: {
                    // 自动修复eslint的错误
                    fix: true
                },
                exclude: /node_modules/
            }
        ]
    },
    // 插件
    plugins: [
        new HtmlWebpackPlugin({
            template: "./src/index.html"
        }),
    ],
    // 模式 development 开发, production 生产
    mode: 'development',
}

package.json

"eslintConfig": {
	"extends": "airbnb-base"
}

index.js

function add(x, y) {
  return x + y;
}

// 下一行eslint所有规则都失效,下一行不进行eslint检查
// eslint-disable-next-line
console.log(add(3, 5));

注意:nodejs版本最好 10 以上。低版本的nodejs会报错。

你可能感兴趣的:(webpack)