webpack插件之html-webpack-plugin

html-webpack-plugin的作用

html-webpack-plugin的主要作用就是在webpack构建后生成html文件，同时把构建好入口js文件引入到生成的html文件中。

安装 html-webpack-plugin

Webpack 5

npm i --save-dev html-webpack-plugin  

Webpack 4

npm i --save-dev html-webpack-plugin@4

webpack.config.js

const HtmlWebpackPlugin = require('html-webpack-plugin')
module.exports = {
    mode:"development",
    plugins: [
        new HtmlWebpackPlugin({
            filename:'index.html',
            template:'./public/index.html'
        })
    ]
}