1️⃣ 安装

  1. npm init
  2. npm i webpack@4 webpack-cli@3 -D
  3. npm install --save-dev clean-webpack-plugin
  4. npm i --save-dev html-webpack-plugin@4

1️⃣ package.json

  1. {
  2.     ......
  3.   "scripts": {
  4.     "build": "webpack --mode=production",
  5.     "dev": "webpack --mode=development"
  6.   },
  7.   ......
  8. }

1️⃣ webpack.config.js

  1. const path = require("path"); 
  2. const { CleanWebpackPlugin } = require('clean-webpack-plugin');
  3. const HtmlWebpackPlugin = require('html-webpack-plugin');
  4. module.exports = {
  5.   mode: 'development', 
  6.   entry: './src/index.js',
  7.   output: { path: path.resolve(__dirname, 'builder'),filename: 'build.js' }, 
  8.   module: { 
  9.     rules: []
  10.   },
  11.   plugins: [ 
  12.     new CleanWebpackPlugin(),
  13.     new HtmlWebpackPlugin({
  14.       template: "./src/index.html", 
  15.       filename: "index.html", 
  16.       title: "测试HTMl", 
  17.     }),
  18.   ],
  19.   devtool: 'cheap-module-eval-source-map', 
  20. }