My Vue projects contains, in the public folder, a large index.html. Currently it is simply copied to the output folder when I build my project as described here.

How can I get webpack to minify it too like it does for all my other files?

CodePudding user response：

I added this to my vue.config.js

module.exports = {
    chainWebpack: config => {
        config
            .plugin('html')
            .tap(args => {
                if (process.env.NODE_ENV === 'production')
                    args[0].minify = {
                        minifyCSS: true,
                        minifyJS: true,
                        minifyURLs: true,
                        removeComments: true,
                        collapseWhitespace: true,
                        collapseBooleanAttributes: true,
                        removeScriptTypeAttributes: true,
                        removeAttributeQuotes: true,
                        removeEmptyAttributes: true,
                        removeStyleLinkTypeAttributes: true
                    };
                return args;
            })
    },
    ...  // Other configs
}

More details here