1.为什么要打包发布
    image.png

    2.在package.json文件的scripts节点下,新增builld命令如下:
    "scripts": {
    "dev": "webpack serve " //开发环境中,运行dev命令
    "build": "webpack --mode production" //项目发布时,运行build命令
    }

    image.png
    注意:—mode优先级要高于配置文件里的mode,会覆盖掉它

    3.把JavaScript文件统一 生成到js目录中
    在webpack.config.js配置文件的output节点中:
    image.png

    4.把图片文件统一生成到image目录中
    修改webpack.config.js中的url-loader 配置项,新增outputPath选项即可指定图片文件的输出路径
    image.png

    5.自动清理dist目录下的旧文件
    安装并配置
    npm install --save-dev clean-webpack-plugin -S
    ①导入插件,得到插件的构造函数,创建插件的实例对象
    const { CleanWebpackPlugin } = require('clean-webpack-plugin');
    const webpackConfig = {
    plugins: [ new CleanWebpackPlugin(),
    ]
    };
    image.png