webpack定制化 代码规范[eslint]

前提：
webpack5及其对应配套内容
node16.13.2

webpack定制化 基础配置[基础、配置、初运行]
webpack定制化 高级配置[热更新、热打包、别名、调试]
webpack定制化 加载与插件[css加载器、html插件、image打包配置、babel代码兼容、vue加载器及配置]
webpack定制化 优化提速[多进程、压缩、多js打包、多css打包、gzip]
webpack定制化 环境配置[开发环境、生产环境、前后端半分离环境]

一.代码规范

1.eslint

解释：其通过内置规矩使得代码更加规范（多个人都使用这一套规则来书写），比如：不适用双引号；间隔两个空格等等

安装：
A：npm i eslint -D
B：初始化配置(如图所示使用GitHub的标准规范)

C：适配webpack
安装：npm i eslint-webpack-plugin -D

const ESLintPlugin = require('eslint-webpack-plugin')
module.exports = {
  mode: 'development',
  plugins: [
    new ESLintPlugin({
      // 运行的时候自动帮你修复错误
      fix: true,
    })],

}
1
2
3
4
5
6
7
8
9
10