当前位置:   article > 正文

uniapp 小程序分包详解~

uniapp 小程序分包

一、为什么要分包

优化项目首次启动的下载时间;小程序默认就是整包(主包)下载,但这会导致整个项目只有在全部加载完毕后才会回显到用户眼前,这样虽然可以使用加载动画进行优化,但也会有部分可能导致用户流失;
防止项目超出小程序官方对小程序项目打包后的大小限制;
若不分包,整个程序最大限制不能超过2M,分包后,整个项目(包含主包+子包)最大不能超过16M,单个包不能超过2M (这样就规避了项目最大不得超过2m的限制)

二、小程序分包

2.1 分包原则

声明 subpackages   会按照subpackages配置的路径进行打包 subpackages  配置路径外的将会被打包进主包   tabBar 页面必须在主包里面

2.2 分包步骤 

在根目录创建两个分包  pagesA 和 pagesB  (名字随意) subpackages和pages同级

  1. {
  2. "pages": [
  3. "pages/index/index",
  4. "pages/good/index",
  5. ],
  6. "subpackages":[
  7. {
  8. "root":"pagesA", //分包的根路径,彼此之间不可以重复
  9. "name":"pagesA", //分包的标识名字,用于预加载分包时用
  10. "pages":[ //分包的路径(不预加载的时候,用户进入分包路径才会加载分包资源)
  11. "register/register"
  12. ],
  13. "independent":false //是否独立分包(可以不加载主包就独立加载的包,独立分包不能当做全局资源)
  14. },
  15. {
  16. "root":"pagesB",
  17. "name":"pagesB",
  18. "pages":[
  19. "children/addChildren"
  20. ],
  21. "independent":false
  22. }
  23. ],
  24. //预加载
  25. "preloadRule": {
  26. "pages/index": {
  27. "network": "",
  28. "packages": ["pagesA"] // 在 pages/index 页面中预加载名为 pagesA分包内容
  29. }
  30. }
  31. }

创建相对应的文件夹  里面可以放图片等其他资源和页面 

静态资源哪个模块的就放哪个包下,不要共享,共享就会变成主包里的资源。

 

查看分包状态

 

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/菜鸟追梦旅行/article/detail/671691
推荐阅读