前言

有時候我們的小程序太大，首次打開小程序的時候回比較慢，這個時候我們可以試試分包操作。分包可以讓用戶在操作小程序的時候按需下載資源（用戶在進入某些頁面的時候才去下載相應的資源，可以加快小程序的速度，優(yōu)化用戶體驗）。

小程序代碼有個2M限制，是不是有的時候放圖片都得忍著點，不敢把太大的放在小程序里面，只能放遠程；但是隨著項目不斷迭代更新，代碼圖片越來越多，開發(fā)的時候更加小心翼翼。是不是很不舒服，還能不能讓我舒服的敲代碼了。

那就說一下分包的限制吧；分包以后單獨包最大不能超過2M；整個小程序可以達到20M；比那2M限制翻了10倍；那就讓我們愉快地敲代碼吧。

打包原則：

• 聲明 subpackages后，將按 subpackages 配置路徑進行打包，subpackages 配置路徑外的目錄將被打包到 app（主包） 中
• app（主包）也可以有自己的 pages（即最外層的 pages 字段）
• subpackage 的根目錄不能是另外一個subpackage內的子目錄
  -tabBar頁面必須在 app（主包）內
• 登錄頁面和tabbar頁面，這幾個頁面是要分成主包的，tabBar 頁面必須在 app（主包）內

引用原則：

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

1.首先在app.json里面全局配置里面配置分包：（subpackages 屬性和pages同級）

我在根路徑創(chuàng)建了兩個分包，分別是home和pay

  "pages": [
    "pages/index/index",
    "pages/user/index",
  ],
  "subpackages":[
    {
      "root":"template/home", //分包的根路徑，彼此之間不可以重復
      "name":"home",  	//分包的標識名字，用于預加載分包時用
      "pages":[			//分包的路徑（不預加載的時候，用戶進入分包路徑才會加載分包資源）
        "shop_house/shop_house"
      ],
      "independent":false   //是否獨立分包（可以不加載主包就獨立加載的包，獨立分包不能當做全局資源）
    },
    {
      "root":"template/pay",
      "name":"pay",
      "pages":[
        "pay_house/pay_house"
      ],
      "independent":false
    }
  ],

2.創(chuàng)建文件

template是存放分包的文件夾。home和pay這兩個文件夾分別是template的子文件夾，里面可以放圖片等其他資源和頁面。
注意：靜態(tài)資源哪個模塊的就放哪個包下，不要共享，共享就會變成主包里的資源。這也就是為什么不直接把images文件放在template根路徑的原因

3.查看分包效果

4.主包與分包之間的頁面跳轉

1）主包跳轉到分包

注意：跳轉的路徑要帶上分包里配置的root這一級（所有的相對路徑全部寫上），不然它找不到路徑就會報錯

主包：

<!--pages/user/index.wxml-->
<text>pages/user/index.wxml</text>
<image src="../images/1.jpeg"></image>
<navigator url="../../template/home/shop_house/shop_house">跳轉shopping_house</navigator>
<navigator url="../../template/pay/pay_house/pay_house">跳轉pay_house</navigator>

分包：

<!--template/pay/pay_house/pay_house.wxml-->
<text>template/pay/pay_house/pay_house.wxml</text>
<image src="../images/3.jpeg"></image>

2）分包跳轉到主包

分包跳轉到主包（方法很多種，我這里說兩種）

• wx.switchTab(Object object)

跳轉到 tabBar 頁面，并關閉其他所有非 tabBar 頁面，路徑后不能帶參數(shù)。

此方法跳轉的頁面必須是在tabBar定義過的頁面

• wx.reLaunch(Object object)

關閉所有頁面，打開到應用內的某個頁面，路徑后面可帶參數(shù)。

分包：

點擊“去首頁”，這樣就直接去主頁了

<navigator open-type="switchTab" url="/pages/index/index">去首頁</navigator>

總結

到此這篇關于微信小程序分包操作的文章就介紹到這了,更多相關微信小程序分包操作內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！