如果默认生成的 HTML 文件不适合需求，可以创建/使用自定义模板。
一是通过 inject 选项，然后传递给定制的 HTML 文件。html-webpack-plugin 将会自动注入所有需要的 CSS, js, manifest 和 favicon 文件到标记中。
plugins: [
new HtmlWebpackPlugin({
title: 'Custom template',
template: 'myIndex.html', // Load a custom template
inject: 'body' // Inject all scripts into the body
})
]
自定义的myIndex.html
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8"/> <title><%= htmlWebpackPlugin.options.title %></title> </head> <body> </body> </html>
参考：http://www.cnblogs.com/haogj/p/5160821.html
另一个是配置html-webpack-plugin
使之直接为项目生成一个或多个HTML文件（HTML文件个数由插件实例的个数决定），
并将webpack打包后输出的所有脚本文件自动添加到插件生成的HTML文件中。
以下例子将通过配置，可以将根目录下用户自定义的HTML文件作为插件生成HTML文件的模板。另外，还可以通过向插件传递参数，控制HTML文件的输出。
1.在项目根目录下安装插件
cnpm install html-webpack-plugin --save-dev
2.在webpack配置文件头部require html-webpack-plugin模块，并保存引用至htmlWebpackPlugin[变量]。
const HtmlWebpackPlugin = require('html-webpack-plugin')
module.exports = { entry: { main:'./src/script/main.js' }, output: { path: './dist', filename: 'js/[name].bundle.js' }, plugins:[ new htmlWebpackPlugin() ] }
4.配置参数。为新建的对象实例传入一个对象字面量参数，初始化对象实例的属性
plugins: [ new webpack.DefinePlugin({ 'process.env': require('../config/dev.env') }), new webpack.HotModuleReplacementPlugin(), new webpack.NamedModulesPlugin(), // HMR shows correct file names in console on update. new webpack.NoEmitOnErrorsPlugin(), // https://github.com/ampedandwired/html-webpack-plugin new HtmlWebpackPlugin({ filename: 'index.html', template: 'index.html', inject: true, favicon: resolve('favicon.ico'), title: 'vue-element-admin', path: config.dev.assetsPublicPath + config.dev.assetsSubDirectory }), ]
5.在HTML中使用
<body> <script src=<%= htmlWebpackPlugin.options.path %>/tinymce4.7.5/tinymce.min.js></script> <div id="app"></div> <!-- built files will be auto injected --> </body>
参考：
https://www.jianshu.com/p/89414e89c563