【微信小程序】分包

简介: 【微信小程序】分包

分包的基础概念


1、什么是分包


分包指的是把一个完整的小程序项目,按照需求划分为不同的子包,在构建时打包成不同的分包,用户在使用时按需进行加载。


2、分包的好处


对小程序进行分包的好处主要有以下两点:


  • 可以优化小程序首次启动的下载时间


  • 在多团队共同开发时可以更好的解耦协作


3、分包后项目的构成


分包后,小程序项目由1个主包+多个分包组成:


  • 主包: 一般只包含项目的启动页面或TabBar页面、以及所有分包都需要用到的一 些公共资源


  • 分包:只包含和当前分包有关的页面和私有资源


4、分包的加载规则


💥💥💥在小程序启动时,默认会下载主包并启动主包内页面tabBar 页面需要放到主包中


💥💥💥当用户进入分包内某个页面时,客户端会把对应分包下载下来,下载完成后再进行展示非 tabBar页面可以按照功能的不同,划分为不同的分包之后,进行按需下载



5、分包的体积限制


目前,小程序分包的大小有以下两个限制:


  • 整个小程序所有分包大小不超过16M (主包+所有分包)


  • 单个分包/主包大小不能超过 2M


分包的基本用法


1、配置方法


//示例代码
"subPackages": [
    {
      "root":"pkgA",
      "name":"p1",
      "pages": [
        "pages/cat/cat",
        "pages/dog/dog"
      ]
    },
    {
      "root":"pkgB",
      "name":"p2",
      "pages": [
        "pages/apple/apple",
        "pages/banana/banana"
      ]
    }
  ],


2、打包原则


  • 小程序会按subpackages的配置进行分包subpackages 之外的目录将被打包到主包中


  • 主包也可以有自己的pages (即最外层的pages字段)


  • tabBar 页面必须在主包内


  • 分包之间不能互相嵌套


独立分包


1、什么是独立分包


独立分包本质上也是分包,只不过它比较特殊,可以独立于主包和其他分包而单独运行


2、独立分包和普通分包的区别


最主要的区别:是否依赖于主包才能运行


  • 普通分包必须依赖于主包才能运行


  • 独立分包可以在不下载主包的情况下,独立运行


3、独立分包的应用场景


开发者可以按需,将某些具有- -定功能独立性的页面配置到独立分包中。原因如下:


  • 当小程序从普通的分包页面启动时,需要首先下载主包


  • 而独立分包不依赖主包即可运行,可以很大程度上提升分包页面的启动速度、


4、独立分包的配置方法



5、引用原则


独立分包和普通分包以及主包之间,是相互隔绝的,不能相互引用彼此的资源,例如:


💥主包无法引用独立分包内的私有资源


💥💥独立分包之间,不能相互引用私有资源


💥💥💥独立分包和普通分包之间,不能相互引用私有资源


💥💥💥💥💥特别注意:独立分包中不能引用主包内的公共资源



目录
相关文章
|
13天前
|
人工智能 小程序 JavaScript
【一步步开发AI运动小程序】十四、主包超出2M大小限制,如何将插件分包发布?
本文介绍了如何从零开始开发一个AI运动小程序,重点讲解了通过分包技术解决程序包超过2M限制的问题。详细步骤包括在uni-app中创建分包、配置`manifest.json`和`pages.json`文件,并提供了分包前后代码大小对比,帮助开发者高效实现AI运动功能。
|
4月前
|
存储 小程序 Java
【小程序分包】小程序包大于2M,来这教你分包啊
本文介绍了如何通过分包解决uniapp小程序包体积过大的问题。由于版本升级导致包体积超过2M,即使压缩静态资源也无法满足发布要求。文章详细讲解了分包的原因、步骤及注意事项,并提供了实操示例,帮助读者理解并实现小程序分包,从而减小主包大小
218 1
【小程序分包】小程序包大于2M,来这教你分包啊
|
3月前
|
小程序 JavaScript 开发者
微信小程序分包的相关概念和使用
本文介绍了微信小程序分包的概念、优势、配置方法、加载规则、体积限制,以及独立分包和分包预下载的配置,旨在帮助开发者优化小程序的加载速度和开发效率。
|
5月前
|
小程序
跨端技术问题之页面或组件样式在小程序、小程序插件和小程序分包中有什么差异
跨端技术问题之页面或组件样式在小程序、小程序插件和小程序分包中有什么差异
|
5月前
|
小程序 API
跨端技术问题之哪些形态可以通过getApp()获取全局App实例
跨端技术问题之哪些形态可以通过getApp()获取全局App实例
|
5月前
|
小程序
【微信小程序-原生开发】实用教程21 - 分包
【微信小程序-原生开发】实用教程21 - 分包
401 0
|
7月前
|
小程序
微信小程序-分包
微信小程序-分包
74 0
|
7月前
|
小程序 开发工具 UED
小程序分包的详细流程
小程序分包的详细流程
258 2
|
7月前
|
小程序 开发者
解决微信小程序因为包太大无法上传:uniapp分包
解决微信小程序因为包太大无法上传:uniapp分包
252 0
|
7月前
|
小程序 开发者
【微信小程序】-- 分包 - 独立分包 & 分包预下载(四十五)
【微信小程序】-- 分包 - 独立分包 & 分包预下载(四十五)
14929 0