微搭低程式碼已上線 「分模組混合開發」 能力。

使用者可以在視覺化編輯應用的基礎上，通過程式碼開發並部署應用的方式享受更加完整的一站式開發體驗。

下文將詳細介紹分模組混合開發的使用場景和使用方法。

應用場景

應用場景1：多團隊合作開發

當開發一個大型專案時，往往並非一個主開發團隊可以單獨開發完成的，大型專案的協作場景決定了需要 多團隊協同開發的模式。而多團隊協同開發一個專案時就會遇到各種各樣的問題，如果處理不好，會造成開發效率低、進度延後等問題，是專案的一大風險點。

應用場景2：低程式碼開發與傳統編碼結合開發

一部分微搭使用者並非從零開始開發，則會遇到存量應用遷移的問題。有時因為時間原因，難以把應用所有內容都進行低碼化遷移。

解決方案：分模組混合開發

針對以上痛點，我們可以利用分模組混合開發來解決。
騰訊雲微搭低程式碼在視覺化編輯應用的基礎上，提供了一種通過程式碼開發並部署應用的方式。它具有以下優點：

• 一個應用可拆分為主模組和多個子模組，分模組進行開發；
• 模組間各自解耦、相對獨立；
• 每個模組支援 【低程式碼開發】和【上傳程式碼包】 兩種開發模式；
• 開發完成後，由微搭平臺完成合並打包釋出，整個過程方便省事。

基本概念：

• 應用主模組：每個應用程式必定含有唯一一個應用主模組。與子模組相比，主模組具有應用級配置。
• 應用子模組：每個應用可含有 N 個子模組，而如何進行拆分則是根據開發者的配置進行劃分。
• 低程式碼開發模式：通過微搭低程式碼進行視覺化開發。
• 上傳程式碼包模式：允許使用者上傳傳統開發模式的程式碼包。

注意：目前僅支援對小程式進行混合開發。開始體驗混合開發

使用方法

使用分模組混合開發需要先明確主子關係，每個模組低碼模式認為是低程式碼編輯應用，程式碼包認為是原生小程式應用。

• 程式碼包作為主模組：需保證內容為完整的小程式專案程式碼，專案結構滿足下方系統限制的要求，在 app.js 的 onLaunch 函式中掛載 weda app 物件（新增程式碼，this.app = wedaApp）,掛載完成後，子包和其他模組可以通過const { app } = getApp() 的方式獲取到 weda app 物件。
• 程式碼包作為子模組：需保證內容為獨立的小程式應用目錄，即 miniprogramRoot 目錄。整體專案會放置到 /packages/${subapp.name} 路徑，因此原有檔案引用以及路由跳轉中使用絕對路徑的部分可能需要進行修正，包內檔案的相對路徑關係不會改變。整體而言，此處要求最終改造完的程式碼包為小程式子包模式的程式碼包，並增加一個app.json 在其中宣告包中的頁面列表。例如：子包 sub 中的 app.json 內容為：

{
  "pages": [
    "pages/index/index",
    "pages/checkbox/index",
    "pages/switch/index",
    "pages/slider/index"
  ]
}

則最終在生成的完整小程式app.json 中會新增配置：

{
  "subpackages": [
    {
      "root": "packages/sub",
      "pages": [
        "pages/index/index",
        "pages/checkbox/index",
        "pages/switch/index",
        "pages/slider/index"
      ]
    }
  ]
}

使用低碼編輯的主/子模組：系統會自動生成相關的程式碼，無需過度關心引用關係，只需關係應用本身的業務邏輯，當前頁面跳轉時跳轉到主包的頁面，還是子包的頁面即可。

主子模組互動

微搭應用狀態分全域性狀態與頁面級狀態，全域性狀態整個應用共享，頁面級狀態每個頁面獨立，因此當主子模組之間需要進行資料互動時，應當使用全域性狀態進行代理儲存。在低程式碼中，可以通過獲取 app 物件，對其上的全域性變數獲取/賦值，在程式碼包型別的模組中， 可以使用 const { app } = getApp() 的方式獲取到 app 物件，從而獲取/賦值變數，以及使用資料來源等方法。

主模組頁面路徑為 /pages/${page.id}/index，子模組頁面路徑為：

/packages/${subapp.name}/pages/${page.id}/index。

在處理路由跳轉時需要明確對應的模板地址。

注意以下限制：

• 每個應用包涵 1 個主模組以及不超過 5 個子模組，當主子模組中至少包涵一個低碼編輯型別的模組時，可以在微搭平臺上進行混合構建。
• 主模組為程式碼包型別時，其為完整的小程式應用，解壓後根目錄需包涵 project.config.json 檔案，其中宣告小程式應用根目錄（miniprogramRoot），若未宣告則預設為根目錄，根目錄下包涵 app.json、app.js、app.wxss 等應用級別檔案，同時 packages、common、app、materials、lowcode 為保留目錄，當與低碼模組共同生成應用時會在此目錄下生成低碼所需的檔案。
• 子模組為程式碼包型別時，其須為獨立的小程式應用目錄，即 miniprogramRoot。解壓後根目錄包涵 app.json 等應用級別檔案，其內容會與低碼生成的主模組配置進行合併。
• 應用級別的低程式碼、變數管理，只能在主應用中完成，低碼編輯類子模組可在編輯器中檢視，但無法進行定義宣告以及增刪改編輯。