Webpack 基础操作守则(基础打包版)：

作为一个前端程序员，怎么能不会webpack,下面开始我的表演：

1. 建立一个空的文件夹 webpackDom
2. 初始化，npm init 如果不想一步一步回车 来一个 npm init -y
3. 下载webpack和webpack-cli : npm i -D webpack webpack-cli
4. 在webpackDom下兴建一个文件夹，bulid，创建一个webpack.config.js
5. 打开 package.json ,配置一下npm run bulid命令（坑，注意配置路径！！！！！）

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "bulid": "webpack --config bulid/webpack.config.js"
},

6. 进入webpack.config.js 开始写入代码

const path = require('path');
const HtmlWebpackPlugin = require("html-webpack-plugin")     // 需要安装 npm i -d html-webpack-plugin
const {CleanWebpackPlugin} = require('clean-webpack-plugin') // 需要安装 npm i -d clean-webpack-plugin
function Url(test){
    return path.resolve(__dirname,test)
}
module.exports = {
    mode:'development', // 开发模式【名称】
    entry: [ Url('../src/main.js'),Url('../src/module1.js')],    // 多入口文件
    output: {
        filename: '[hash:8].js',      // 打包后的文件名称
        path: path.resolve(__dirname,'../dist')  // 打包后的目录
    },
    plugins:[ // 个人理解就是设置 打包以后的文件处理方式
        new HtmlWebpackPlugin({
            template:path.resolve(__dirname,'../index.html') // html合成模板
        }),
        new CleanWebpackPlugin() // 打包后清除上一次打包的数据
    ]
    
}

这一版基本ok，文件目录展示（附上文件目录参考一下吧）：

最后 执行 npm run bulid 试一下吧