4.26 针对webpack打包 简单优化

再图片懒加载 以及 路由懒加载实现后(对主路由设置webpackChunkName即可)
ps:花了一上午,和老师的网站进行对比,始终发觉不对劲,我的网站,首先访问速度较慢,其次,对比network。我发现如下:
1、多出了好多storeGroup文件。
2、文件大小普遍比老师的文件大3-5倍。

针对问题一:
因为路由懒加载,我对每个二级路由都加上了webpackChunkName,经检测只需要加载主路由即可,原理先不论。(先以快速成型为主)

针对问题二:
引发了很多问题,那就是npm run build的问题了
似乎vue-cli 3.0自带 gzip的功能(没仔细注意,也可以继续配置)
先说配置webpack,
1、需要安装依赖compress-webpack-plugin
2、配置vue.config.js ,在module.exports下内
在这里插入图片描述
在这里插入图片描述
3、 npm run build 即可
在这里插入图片描述
4、对nginx进行配置,我是在CentOS6.9版本下。
首先如果nginx没有相关的配置,需要进行编译
./configure --with-http_gzip_static_module
再make && make install
打开nginx的conf配置文件(vim cd /usr/local/nginx/conf/nginx.conf)
在这里插入图片描述
5、nginx -s reload 重启服务
好了,图书优化,暂先到此结束了。
还留了一节git同步部署CentOS项目的操作,留着以后看。
最后,非常感谢Sam老师。虽然我买的是盗版的视频,如果说,在我求职之路上,因为您的知识的传授,使我的就业路变得平坦通畅了。那么待我挣得第一笔薪资,我一定私发您您该得的收益。再次谢谢您。
Respect and Honor!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值