乐趣区

Gzip 压缩上传 优化项目体积包的方案

针对 Vue-cli Gizp 需要了解的事情(vue3.0 以下版本不包含 3.0):
1、找到对应文件 webpack.prod.conf.js;

2、针对源文件(个人不建议删除);

3、打开 Gzip 压缩功能
eg: productionGzip:true

4、执行项目压缩功能(默认是 npm run build),执行完成过后效果如下:

5、前端的项目已经准备好。接下来是 nginx 配置项:
​(1). 打开 nginx 配置文件 nginx.conf

(2). 开启 gzip 压缩功能(注意:gzip_static on; 这行命令如果没有 需要加上)

(3)执行保存命令(wq!)
(4)重启 nginx
1、先执行 nginx 测试
(nginx 路径) -t 根据自己安装目录执行
lnmp 默认路径 : /usr/local/nginx/sbin/nginx -t

2、执行重启命令:
(nginx 路径) -s reload 根据自己安装目录执行


6、接下来就去浏览器访问你们文件就可以看到 (页面没有报错正常执行并且控制台如下):

退出移动版