返回知识库

微信小程序 · 上线

分包与包体积Subpackages & Package Size

小程序每个代码包(主包、每个分包)都不能超过 2MB、合计不超过 30MB:大图片放 CDN 用网址加载,首页之外的页面拆进分包,主包只留启动必需的东西。

把一个超重的主包搬到能上传

上面是四根体积条,下面是代码包仓库。每个块都能搬去分包 A、分包 B,图片还能改用 CDN;搬完点「上传代码」,看上传单通过还是报错。

任务:AI 把商城小程序做完了,所有东西都堆在主包里。把它搬到能上传为止。

主包4.1MB / 2MB ✗ 超限
分包 A0.0MB / 2MB ✓
分包 B0.0MB / 2MB ✓
全部代码包合计4.1MB / 30MB ✓

CDN(不算进代码包):0.0MB

主包启动时必须下载完4.1MB · 超 2MB
页面首页0.4MB
pages/indextabBar 页面
页面我的0.2MB
pages/metabBar 页面
页面商品详情页0.6MB
pages/goods
页面订单页0.5MB
pages/order
页面活动页0.5MB
pages/promo
图片商品大图 ×81.6MB
images/goods-*.png
组件公共组件 · 价格卡0.3MB
components/price-card
分包 A进到这里的页面时才下载0.0MB

空货架

分包 B进到这里的页面时才下载0.0MB

空货架

CDN 图床代码里只留 https 图片网址0.0MB · 不占包体积

还没有图片放到这里(只有图片能放)

上传单 · 开发者工具「上传」

还没上传。点「上传代码」看看当前布局能不能过。

第 1 步:先点「上传代码」看看现在会怎样,再动手搬块。

知识点:刚才的体积条和上传单说明了什么

面板里都碰到过,这里只是起个名字。

  • 单包上限:主包和每个分包都不能超过 2MB,超了上传直接失败,报错会写明是哪个包、多大。
  • 总量上限:所有包加起来不超过 30MB;分包能装更多,但不是无限。
  • 分包放什么:用户不一定马上进去的页面(详情、订单、活动),进入时才下载。
  • tabBar 页面必须在主包;首页等启动就要显示的东西也留主包。
  • 图片走 CDN 最省:代码里只留 https 网址,图片本身不算包体积(CDN 域名同样需要备案)。
  • 分包之间不能互相用对方的资源;两个分包都要用的组件放主包。

什么时候要想到分包

看到这些信号就该回头看包体积。

  • 信号:上传时报「超过 2MB」;AI 说「把图片放进 images 文件夹了」;页面越加越多。
  • 先做 CDN:大图、视频、字体通常是体积大头,挪走往往一次就降下来。
  • 不适合:小程序只有两三个页面、体积远低于 2MB 时,不必为了「规范」硬拆分包。

怎么跟 AI 说、怎么验收

你不用自己改 app.json,但要会提要求、会看结果。

  • 说清规则:「主包只留首页和 tabBar 页面,其他页面按功能拆分包;商品图放 CDN 用网址加载。」
  • 要数字:让 AI 在完成报告里列出主包和每个分包各多大、离 2MB 还剩多少。
  • 验收:真机预览或上传一次,确认没有体积报错;再点进分包页面,确认能正常打开。

正反例:同样是「上传报主包超过 2MB」

同一个报错,只差在先挪什么。

正例「商品图改成 CDN 网址;详情页和订单页拆进分包;首页和 tabBar 页留主包」

主包从 4.1MB 降到 1.4MB,一次上传通过;启动时要下载的东西少了,首页打开也更快。

反例「把首页和 tabBar 页也挪进分包,图片原样留在包里」

违反「tabBar 页面必须在主包」,AI 还得返工;图片原样还在,分包很快又会超 2MB。

快速自测

主包 2.3MB,里面有 1.2MB 的海报图、0.5MB 的活动页、0.6MB 的首页和 tabBar 页。最省事又稳的第一步是?

继续查证

术语的技术定义和行为以这些一手或权威资料为准。

下一步学

和本知识点经常一起出现的概念。