解决问题:每次打包后手动引入js资源,如果打包生成多个文件,甚至文件间可能存在依赖关系,手动引入复杂且繁琐。
安装:
npm install --save-dev html-webpack-plugin
引入:
var HtmlWebpackPlugin = require('html-webpack-plugin');
配置:
//插件
plugins:[
// plugins的配置
new HtmlWebpackPlugin()
],
引入了main.js,但是结构并没有保留。——希望保留DOM结构,再自动引入js。
plugins:[
// plugins的配置
new HtmlWebpackPlugin({
template:path.resolve(__dirname,"public/index.html")
}),
],
以public/index.html为模板创建新的html文件
新文件有两个特点:DOM结构和原来一直;会自动引入打包资源