使用 webpack 构建简单项目,并自动生成脚本名称和与脚本关联的html

webpack.config.js

const path = require('path');
const crypto = require('crypto');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const webpack = require('webpack');
const webpackConfig = {
    entry: path.resolve(__dirname, 'index.js'),
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: crypto
            .createHash('md5')
            .update(new Date()
                .getTime()
                .toString(), 'utf8')
            .digest('hex') + '.bundle.js'
    },
    plugins: [
        new webpack.ProgressPlugin(),
        new CleanWebpackPlugin(),
        new HtmlWebpackPlugin()
    ]
}

module.exports = webpackConfig;

结果

使用 webpack 构建简单项目,并自动生成脚本名称和与脚本关联的html插图