html-webpack-plugin插件

一、说明
webpack-dev-server实现了自动编译刷新浏览器，让编译出来的bundle.js托关于服务器根路径（电脑内存）中去。
使用--contentBase指令指定启动目录（物理磁盘中的页面路径），还需要修改此页面中script标签的src属性（指向url根路径，托管路径），麻烦。除了解决此问题，还需要实现页面也放到内存中，则可以借助于一个webpack插件：html-webpack-plugin，配置启动页面。
二、安装
npm i html-webpack-plugin --save-dev，再项目根目录执行，把插件安装到项目中。
三、基本操作
1、增加webpack配置文件配置（webpack.config.js）。

const htmlWebpackPlugin = require('html-webpack-plugin');   //导入插件

module.exports = {
    plugins:[   //配置插件的节点
        new htmlWebpackPlugin({   //创建一个在内存中生成html页面的插件
            template:path.join(__dirname,'./src/index.html'),   //指定模板页面
            //将来会根据此页面生成内存中的页面
            filename:'index.html'   //指定生成页面的名称，index.html浏览器才会默认直接打开
        })
    ]
}

2、运行webpack-dev-server，不需要手动处理bundle.js的引用了（托管于根路径页面需要修改引用路径），html-webpack-plugin插件生成的内存中的页面已帮我们创建并正确引用了打包编译生成的bundle.js的<script></script>。