使用方法

利用HtmlWebpackPlugin插件，会自动引入js，并且对其进行转译（通过内置的babel-loader）。
首先安装插件

  1. npm install --save-dev html-webpack-plugin

设置插件

  1. const HtmlWebpackPlugin = require('html-webpack-plugin');
  2. module.exports = {
  3.    /*output: {
  4.         filename: 'name.[contenthash].js',
  5.         path: path.resolve(__dirname, 'dist')
  6.     },*/
  7.     plugins: [
  8.         new HtmlWebpackPlugin({
  9.       title: 'My App',//控制html的title
  10.       filename: 'assets/admin.html',//这个控制输出的位置，如果上面有filename的配置，下面可以省略，如上
  11.       template: 'src/assets/test.html'//这个是我们给的html内容，他会按照这个进行创建，注意模板里的title会覆盖上面的
  12.         }),
  13.     ],
  14. };

这个插件可以在自动生成的过程中，自动添加dist中输出的bundle.js，而且，在我们更新了内容之后，重新webpack，它会自动更新html的引用

htmlWebpackPlugin.options

这个就是指向的 new HtmlWebpackPlugin的括号中的内容，可以使用这个来引用
例如下面是我们的template html

  1. <!DOCTYPE html>
  2. <html lang="en">
  3.   <head>
  4.     <meta charset="UTF-8" />
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6.     <title><%= htmlWebpackPlugin.options.title %></title>//使用这个来引用我们自己定义的title
  7.   </head>
  8.   <body>
  9.     <h1>aaaa</h1>
  10.   </body>
  11. </html>

其他的使用内容

还有很多没有提到
https://github.com/jantimon/html-webpack-plugin