npm install -g webpack webpack-cli

• 在项目根目录中创建配置文件webpack.config.js（文件名最好固定，内容结构固定）

  // Node.js内置模块
  const path = require("path");
  module.exports = {
    // 配置入口文件
    entry: "./src/assets/js/main.js",
    output: {
      // 输出路径，__dirname：当前文件所在路径，最好事先创建好
      path: path.resolve(__dirname, "./dist"),
      // 输出文件
      filename: "bundle.js"
    }
  }
  

• 命令行执行编译命令
  • cmd窗口执行

    webpack   # 这个会有警告信息
    或者
    webpack --mode=development    # 这个没有警告信息
    

• 完成js文件的打包

npm install --save-dev style-loader css-loader

module: {
  rules: [
    {
      // 打包规则应用到以css结尾的文件上
      test: /\.css$/,
      use: ['style-loader', 'css-loader']
    }
  ]
}