要在Vue CLI3中启用gzip压缩，能够应用compression-webpack-plugin插件。

1. 装置插件：在终端中运行以下命令装置compression-webpack-plugin插件：

npm install --save-dev compression-webpack-plugin

2. 批改配置：在vue.config.js文件中增加以下代码：

const CompressionPlugin = require('compression-webpack-plugin');module.exports = {  configureWebpack: {    plugins: [      new CompressionPlugin({        algorithm: 'gzip', // 应用gzip压缩        test: /\.js$|\.html$|\.mp4$|\.*$|\.css$/, // 匹配文件名        filename: '[path][base].gz[query]', // 压缩后的文件名(放弃原文件名，后缀加.gz)        minRatio: 1, // 压缩率小于1才会压缩        threshold: 10240, // 对超过10k的数据压缩        deleteOriginalAssets: false, // 是否删除未压缩的源文件，审慎设置，如果心愿提供非gzip的资源，可不设置或者设置为false（比方删除打包后的gz后还能够加载到原始资源文件）      })    ]  }}

这将在webpack配置中增加compression-webpack-plugin插件，并配置它以压缩.js，.html和.css文件。3. 从新构建：从新构建Vue我的项目，压缩后的文件应该曾经生成了。
如果构建胜利，则在dist目录下应该会看到被压缩后的文件，例如app.js.gz，app.html.gz等。

编辑 Nginx 配置文件

#开启gzip压缩性能gzip on;gzip_min_length 1024;gzip_buffers 4 16k;gzip_comp_level 2;gzip_types *;gzip_vary on;