(二十)(router)路由赖加载和项目打包

发布时间:2022-06-20 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了(二十)(router)路由赖加载和项目打包脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
1:赖加载路由的定义方式:
const Home =()=>import (/* webpackChunkName: "homess" */ './components/home.vue')
  routes:[
  { path: '/home', component: Home},
]
赖加载路由的好处:
如果是直接加载,不用赖加载,在路由特别多的情况加载js和css的数量就非常大,所以在首次加载首页的时候就会出现卡顿的情况
如果是赖加载就会把对应赖加载的路由的js,css文件分离处理,等用到的时候才会去加载,呢种就避免了首页卡顿,
当执行 yarn run build完成后

(二十)(router)路由赖加载和项目打包

上图可以看出赖加载的路由对应的css,js文件都被分离出来了,当没有用到对应的赖加载路由时候就不会去加载呢些js,cs

2:/* webpackChunkName: "homess" */  就是打包过后的对于的静态路由的名称,可以自定义

3:打包运行   yarn run build,打包后复制dist中所有文件拷贝到对应的web下面路径下运行

脚本宝典总结

以上是脚本宝典为你收集整理的(二十)(router)路由赖加载和项目打包全部内容,希望文章能够帮你解决(二十)(router)路由赖加载和项目打包所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签: