webpack设置了压缩，html也会被压缩，什么参数能排除html被压缩？

Question

求问，webpack设置了压缩，html也会被压缩，什么参数能排除html被压缩？

更新下文件夹结构

var fs = require('fs');
var path = require('path');
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var CommonsChunkPlugin = webpack.optimize.CommonsChunkPlugin;

// config
var CFG = require('./config.js');
// path
var SRC_DIR = CFG.path.src;
var DIST_DIR = CFG.path.dist;
// 遍历html, 生成入口名
function scan_entry(dir, cb) {
    fs.readdirSync(dir).forEach(function(file) {
        var pathname = path.join(dir, file);
        if (fs.statSync(pathname).isFile()) {
            cb(file.replace('.html', ''));
        }
    });
}
// 多入口
var cfg_entry = {}
    // 多html
var cfg_plugins = [
    new ExtractTextPlugin('../css/[name].css'),
    new CommonsChunkPlugin({
        filename: CFG.commons + '.js',
        name: CFG.commons
    }),
    new webpack.optimize.UglifyJsPlugin({
        compress: {
            // sourceMap: true,
            warnings: false
        }
    })
];

scan_entry(path.join(SRC_DIR, CFG.path.view), function(entry) {
    cfg_entry[entry] = SRC_DIR + entry + '.js';
    cfg_plugins.push(
        new HtmlWebpackPlugin({
            mobile: true,
            template: path.join(SRC_DIR, CFG.path.view, entry + '.html'),
            filename: path.join('../view/', entry + '.html'),
            chunks: [CFG.commons, entry]
        })
    );
});
//++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
//                                     webpack run
//++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++



module.exports = {
    entry: cfg_entry,
    output: {
        path: DIST_DIR + 'js/',
        // publicPath: DIST_DIR,
        filename: '[name].js',
        chunkFilename: "[id].chunk.js"
    },
    module: {
        loaders: [
            { test: /\.scss$/, loader: ExtractTextPlugin.extract(['css', 'sass']) },
            { test: /\.css$/, loader: ExtractTextPlugin.extract(['css']) }, {
                test: /\.(png|jpg|git|svg)$/,
                loader: 'url-loader',
                query: {
                    name: '../img/[name].[ext]',
                    limit: 1
                }
            }, {
                test: /\.json$/,
                loader: 'json'
            }, {
                test: /\.html$/,
                loader: 'html?interpolate'
            }
        ]
    },
    plugins: cfg_plugins
};

Answer 1

你这是模版, 要加到js文件里去的, 当然会被压缩了

Answer 2

https://github.com/ampedandwi...

这里说明了，如果单纯使用html-webpack-plugin插件来处理html，那么在此插件下设置minify为false，就不会压缩html文件；但是如果使用了loader与html-webpack-plugin一起处理html，那么html的压缩还受loader的影响。

从你的描述来看，我估计是受了loader的影响了。

Answer 3

这么牛？哪里的html被压缩了？

补充：

html的部分，看样子是通过html-webpack-plugin插件处理的，里面确实有个选项minify可以压缩html，但你也没设置啊，默认值就是false。

你说的html是我说的这个部分么？

Answer 4

你确定你这套文件跑了webpack，这里导出了webpack配置，然后根本没跑啊。
看着是遍历了几个制定目录，然后把html变成了js，然后你说的压缩可能是用了uglify那里对js进行的压缩吧

Answer 5

{
            test: /\.html$/,

            loader: 'html?minimize=false'
 }

就这么简单

Answer 6

这个压缩是在vue-html-loader里面完成的：

if(typeof config.minimize === "boolean" ? config.minimize : this.minimize) {
    var minimizeOptions = assign({}, config);

    [
        "removeComments",
        "removeCommentsFromCDATA",
        "removeCDATASectionsFromCDATA",
        "collapseWhitespace",
        "conservativeCollapse",
        "removeAttributeQuotes",
        "useShortDoctype",
        "keepClosingSlash",
        "removeScriptTypeAttributes",
        "removeStyleLinkTypeAttributes"
    ].forEach(function(name) {
        if(typeof minimizeOptions[name] === "undefined") {
            minimizeOptions[name] = true;
        }
    });

    content = htmlMinifier.minify(content, minimizeOptions);
}