webpack之HTML插件

1、安装启动服务的插件
yarn add webpack-dev-server -D

2、启动

3、访问，默认访问的的根目录，但是我们需要访问的是html首文件，所以需要设置访问的目录

4、添加以下设置即可

    devServer:{
       port:3000,
       progress:true,
       contentBase:'/dist',
       compress:true
    },

5、想要直接使用模板文件然后生成html的首页文件,使用
html-webpack-plugin

6、安装html插件
yarn add html-webpack-plugin -D

7、设置
let HtmlWebpackPulgin = require('html-webpack-plugin')

plugins:[
        new HtmlWebpackPulgin({
            template:'./src/index.html',
            filename:'index.html',
            // 压缩
            minify:{
                // 删除双引号
                removeAttributeQuotes:true,
                // 变成一行
                collapseWhitespace:true
            }
        })
    ]

src下建立的模板文件