Technology Sharing

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

vue-cli project

1. Install npm i compression-webpack-plugin -D

npm i compression-webpack-plugin -D
1

2. Use: in vue.config.js file

const CompressionPlugin = require('compression-webpack-plugin')
module.exports = {
    configureWebpack: {
        plugins: [
            new CompressionPlugin({
                test: /.js$|.html$|.css/,
                threshold: 10240 // 只处理比这个值大的资源。按字节计算 设置的是 10kb
            })
        ]
    }
}

1
2
3
4
5
6
7
8
9
10
11
12

You can see that the 1.2M vendors file is compressed to 295k, and the web page running speed is improved.
It can be opened within s.
If the style is not recognized, the CSS file will not be compressed. This function requires the backend to enable gzip so that such files can be recognized.