风来自远方 相爱的人总会相逢
博主 风来自远方
蜀ICP备15021793号-2博主 1月8日 在线自豪地使用 Typecho 建站搭配使用 🌻Sunny 主题当前在线 7 人
歌曲封面 未知作品

蜀ICP备15021793号-2

网站已运行 4 年 221 天 14 小时 33 分

Powered by Typecho & Sunny

8 online · 55 ms

Title

记录Vue使用webpack进行优化打包(水)

Quite

·

日常

·

Article
⚠️ 本文最后更新于2021年01月31日,已经过了1522天没有更新,若内容或图片失效,请留言反馈

[card-default width="卡片宽度" label="说明"]因vue打包后app.css跟vendor.js较大首次加载缓慢,单页面首次会把所有界面和接口都加载出来,会有多次的请求和响应,数据不能马上加载二者相加所以会有长时间的白屏[/card-default]

第三方插件使用cdn引入

QQ截图20210131160021.jpg
使用cdn引入所需要的插件库,减小build后的源代码体积,基于vue的第三方库需要在vue引用之后引入,引入之后需要在各个加载了第三方库的页面去掉引入代码

路由懒加载

QQ截图20210131160231.jpg

把分页进行单独打包,需要啥才渲染加载,不会首次就全部加载,减小首次加载白屏的时间

关闭map文件生成

QQ截图20210131160342.jpg

在vue.config.js配置,关闭打包时生成map文件

加载loading

可以在首页添加loading,在加载时调用,不至于显示一片空白

现在已有 1000 次阅读,2 条评论,0 人点赞
Comment:共2条
发表
  1. 头像
    @
    作者的观点新颖且实用,让人在阅读中获得了新的思考和灵感。
    · Windows · Chrome

    👍

    💖

    💯

    💦

    😄

    🪙

    👍 0 💖 0 💯 0 💦 0 😄 0 🪙 0
  2. 头像
    @
    案例丰富,数据详实,论证扎实可信。
    · Windows · Chrome

    👍

    💖

    💯

    💦

    😄

    🪙

    👍 0 💖 0 💯 0 💦 0 😄 0 🪙 0
搜 索 消 息 足 迹
你还不曾留言过..
你还不曾留下足迹..
博主 不再显示
博主