“打包工作者”--webpack，浅谈插件实现自动生成html文件

做项目的时候会发现项目打包体积很大，webpack能够将项目中代码体积减小，提高打开网站的速度。今天来谈一下webpack插件中的自动生成html文件。

1. 下载插件

npm add html-webpack-plugin  -D

2. webpack.config.js配置

// 引入自动生成 html 的插件
const HtmlWebpackPlugin = require('html-webpack-plugin')
// 在webpack.config.js文件中配置plugins
module.exports = {
    plugins: [
        new HtmlWebpackPlugin({
            template: './public/index.html' // template用来指定以此为基准生成打包后html文件
        })
    ]
}

3. 重新打包，并观察dist文件夹下是否多出html，运行看结果

npm run build

要记得安装包和配置环境哦！