vue打包提升访问速度

npm install compression-webpack-plugin@6.1.1

vue.config.js

// const path = require('path');
// const webpack = require('webpack')
const CompressionWebpackPlugin = require('compression-webpack-plugin')
// const productionGzipExtensions = ['js', 'css','img']
// const isProduction = process.env.NODE_ENV === 'production'
module.exports = {
    publicPath: './',
    outputDir: 'dist',
    lintOnSave: true,
    runtimeCompiler: true,
    // 以下是
    configureWebpack:{
        plugins: [
            // new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
            // 下面是下载的插件的配置
            new CompressionWebpackPlugin({
                algorithm: 'gzip',
                // test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
                threshold: 10240,
                minRatio: 0.8
            }),
            // new webpack.optimize.LimitChunkCountPlugin({
            //     maxChunks: 5,
            //     minChunkSize: 100
            // })
        ]
        // plugins: [
    //     new CompressionPlugin({
    //         algorithm: 'gzip', // 使用gzip压缩
    //         test: /\.js$|\.html$|\.css$/, // 匹配文件名
    //         filename: '[path].gz[query]', // 压缩后的文件名(保持原文件名，后缀加.gz)
    //         minRatio: 1, // 压缩率小于1才会压缩
    //         threshold: 10240, // 对超过10k的数据压缩
    //         deleteOriginalAssets: false, // 是否删除未压缩的源文件，谨慎设置，如果希望提供非gzip的资源，可不设置或者设置为false（比如删除打包后的gz后还可以加载到原始资源文件）
    //     }),
    // ],
    },
}