5.html文件打包

webpack.config.js配置

安装依赖
html-webpack-plugin
配置说明
minify:是对html文件进行压缩,removeAttrubuteQuotes是却掉属性的双引号。
hash:为了开发中js有缓存效果,所以加入hash,这样可以有效避免缓存JS。
template:是要打包的html模版路径和文件名称。
const htmlPlugin= require('html-webpack-plugin');
...
    plugins: [
        new htmlPlugin({
            new HtmlWebpackPlugin({
            title: 'Custom template',
            template: './src/index.html', //指定要打包的html路徑和檔名
            filename:'../dist/index.html' ,//指定輸出路徑和檔名 
            hash: true,//給生成的 js 檔案一個獨特的 hash 值 
            showErrors:true,//webpack 編譯出現錯誤
            minify:{//對 html 檔案進行壓縮,minify 的屬性值是一個壓縮選項或者 false 。預設值為false, 不對生成的 html 檔案進行壓縮
                removeComments:true, // 去除註釋
                collapseWhitespace: true //是否去除空格
            }
        })
        })
    ],

你可能感兴趣的:(5.html文件打包)