一、HtmlWebpackPlugin1.作用自动创建HTML自动创建HTML：在构建过程中自动生成一个HTML5文件，该文件可以包含所有webpack打包过程中生成的bundles。这意味着你不需要手动创建HTML文件，插件会为你处理这一切。自动注入资源：自动将打包生成的JavaScript、CSS等文件注入到生成的HTML文

constHtmlWebpackPlugin=require('html-webpack-plugin');module.exports={entry:{app1:'./src/app1.js',app2:'./src/app2.js'},output:{filename:'[name].bundle.js',path:path.resolve

vue-cli文档中的描述如下Index文件#public/index.html 文件是一个会被 html-webpack-plugin 处理的模板。在构建过程中，资源链接会被自动注入。另外，VueCLI也会自动注入resourcehint(preload/prefetch、manifest和图标链接(当用到PWA插件时)以及构建过程中处理的Ja

当我们更改了我们的一个entry入口起点的名称，甚至添加了一个新的入口，会发生什么？会在构建时重新命名生成的bundle，但是我们的 index.html 文件仍然引用旧的名称。此时就可以用 HtmlWebpackPlugin 来解决这个问题。在我们构建之前，虽然在 dist/ 文件夹我们已经有了 index.ht

vue-cli版本:@vue/[email protected]报错现象:想把css和script全部内嵌到html文件中,就用了"HtmlInlineScriptPlugin"插件,打包后js代码被嵌到了head里,导致代码提前执行找不到#app,再配置HtmlWebpackPlugin插件通过inject:"body"指定代码内嵌到body,打包报错"Multipleassetsemitdiff

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

constpath=require("path");constHtmlWebpackPlugin=require("html-webpack-plugin")module.exports={entry:{app:'./src/app.js',main:'./s

背景了解什么是webpack插件，在来看一下不能不知道的两个插件HtmlWebpackPlugin有了这个插件，webpack执行后会自动帮我们在dist目录生成一个html文件，并且添加bundle.js的

namedescribetypedefaultfaviconhtml图标string''title创建的html的titlestring'WebpackApp'metameta标签{object}{}base配置base标签obj