小程序如何使用分包加載


在小程序開發的過程中,小程序的體積會隨着版本的迭代變的越來越大,這時候我們就希望能夠將小程序分成多個包從服務器下載,這樣既可以加快首屏的渲染也便於后續按需加載的實現。小程序在微信客戶端 6.6.0,基礎庫 1.7.3 及以上版本開始支持 分包功能。
在構建小程序分包項目時,構建會輸出一個或多個分包。每個使用分包小程序必定含有一個主包。所謂的主包,即放置默認啟動頁面/TabBar 頁面,以及一些所有分包都需用到公共資源/js 腳本;而分包則是根據開發者的配置進行划分。
在小程序啟動時,默認會下載主包並啟動主包內頁面,當用戶進入分包內某個頁面時,客戶端會把對應分包下載下來,下載完成后再進行展示。

 

配置方法

配置例子

{
  "pages": ["pages/index", "pages/shopcart"], "subpackages": [ { "root": "packageA", "pages": ["pages/mine", "pages/order"] }, { "root": "packageB", "name": "pack2", "pages": ["pages/detail", "pages/pay"] } ] }
├── app.js ├── app.json ├── app.wxss ├── packageA │ └── pages │ ├── mine │ └── order ├── packageB │ └── pages │ ├── pay │ └── detail ├── pages │ ├── index │ └── shopcart └── utils

資源搜索網站大全 https://www.renrenfan.com.cn 廣州VI設計公司https://www.houdianzi.com

打包原則

  • 聲明 subpackages 后,將按 subpackages 配置路徑進行打包,subpackages 配置路徑外的目錄將被打包到 app(主包) 中
  • app(主包)也可以有自己的 pages(即最外層的 pages 字段)
  • subpackage 的根目錄不能是另外一個 subpackage 內的子目錄
  • tabBar 頁面必須在 app(主包)內

 

 

引用原則

  • packageA 無法 require packageB JS 文件,但可以 require app、自己 package 內的 JS 文件
  • packageA 無法 import packageB 的 template,但可以 require app、自己 package 內的 template
  • packageA 無法使用 packageB 的資源,但可以使用 app、自己 package 內的資源


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM