webpack安装 clean-webpack-plugin 和 html-webpack-plugin 是为了重新生成打包的bundle之后清空以前的的bundle之后创建一个新的html文件并将新的bundle插入到HTML中
但是在这个过程中出现一个问题，我创建的HTML模板中，含有id= ‘app’，但是生成的新的HTML这行代码没有了。
HTML模板：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>webpack搭建</title> </head> <body> <div id="root"></div> </body> </html>
webpack配置：
plugins:[
// 清空直接打包好的bundle文件
new CleanWebpackPlugin(),
// 重新构建html模板
new HtmlWebpackPlugin({
title: 'index文件',
filename:'index.html',
template: './index.html'
}) ,
]
新生成的HTML模板：缺少我设置的 <div id="root"></div>
解决办法：更换清除模板和创建模板的位置
plugins:[
// 重新构建html模板
new HtmlWebpackPlugin({
title: 'index文件',
filename:'index.html',
template: './index.html'
}) ,
// 清空直接打包好的bundle文件 ------ 清除模板放到下面
new CleanWebpackPlugin(),
],
具体为什么会出现这个原因，我还没有了解清除。会继续追踪这个问题的。