擴展工具箱

mPaaS 小程序的擴展配置，均在 IDE 擴展工具箱中實現。點擊界面左側的工具箱圖標（）即可打開 IDE 擴展工具。

設置

白名單設置

點擊工具箱中的 設置 > 白名單設置，輸入白名單并確認即可。此白名單對應的是登錄 App 客戶端的 userId。只有將正確的 userId 加入白名單，對應的用戶才可以獲取 預覽、調試 的小程序包。

小程序設置

點擊工具箱中的 設置 > 小程序設置 可打開小程序的設置頁面，系統會根據您的小程序代碼中的一些配置，提示配置項中易錯的選項。

功能

導出

點擊工具箱中的 功能 > 導出，選中小程序版本后點擊 導出 即可。

此功能是拉取最新版的小程序正式包，并下載至本地。

清除緩存

點擊工具箱中的 功能 > 清除緩存 即可清除 mPaaS 小程序產生的緩存文件。

多端開發

在 mPaaS 小程序 IDE 中開發的小程序，不僅可以投放到使用 mPaaS 框架開發的 App 中，還可以通過mPaaS 小程序 IDE 喚起微信小程序 IDE 進行聯調，或快速構建為 H5 應用、實現真機預覽。

微信小程序

1. 打開小程序 IDE，在 模板選取 中通過 多端開發模板（uni-app） 或 多端開發模板（remax） 創建可多端開發的小程序工程；如果您已創建了可多端開發的小程序工程，也可以直接打開。

2. 如果是新建的多端開發小程序，會提示安裝依賴，點擊 安裝所有依賴 即可。

   

   您也可以點擊界面左側的依賴管理按鈕（），通過插件中的依賴管理安裝。安裝完依賴后，就可以在 IDE 的模擬器中預覽到小程序了。

   說明

   若安裝完成提示錯誤，可以切換至終端，通過 yarn 手動安裝依賴，如下圖所示。

   

3. 下載安裝微信的小程序 IDE。并登錄、開啟服務端口。

4. 點擊 IDE 界面左側的 mPaaS 工具箱（），并在右側選擇 多端開發 標簽。

5. 選擇 微信小程序。在下方的配置項中，需要輸入以下內容：

   • 配置開發者工具：即在本機安裝的微信開發者工具路徑。

   • 項目名稱：在微信開發者工具中顯示的小程序項目名稱。

   • appid：欲關聯的、在微信開發者工具中所創建的項目的 ID。

6. 點擊 開始調試，此時將喚起微信小程序開發者工具，并在開發者工具中展示當前小程序的實時預覽效果。

7. 真機預覽。點擊微信小程序開發者工具界面右上方的 預覽，并使用手機微信掃描生成的二維碼，即可在真機中微信預覽該小程序。

HTML5

1. 打開小程序 IDE，并選擇一個想要進行多端開發的工程。

2. 點擊 IDE 界面左側的 mPaaS 工具箱（），并在右側選擇 多端開發 標簽。

3. 選擇 HTML5 展開，在下方無需進行額外配置。

4. 點擊 開始調試，IDE 會彈出 HTML 調試 窗口并開始構建，同時會生成一個二維碼用于真機掃描。

5. 預覽。您可選擇使用手機進行真機預覽，或使用電腦瀏覽器進行預覽。

   • 真機預覽：在手機端打開支持 H5 的 App 并掃描生成的二維碼，即可在手機 App 中預覽該小程序。這時您也可以選擇 在瀏覽器中打開，并通過手機瀏覽器預覽該小程序。

     說明

     使用手機進行 HTML5 預覽時，需保證預覽所用的手機與電腦處于同一網段中。

   • 電腦瀏覽器預覽：您可以復制 Local 處的 URL（如下圖所示），并粘貼至電腦本機的瀏覽器中來預覽該小程序。