跳至主要內容
版本:v8

建置和部署你的應用程式

既然您已建置了第一個應用程式,您會希望將它發佈,讓大家開始使用。建置和部署應用程式的機制可能相當繁瑣。這就是 Appflow 的作用。Appflow 可讓您有效地產生網頁和原生建置、推送即時應用程式更新、將應用程式發佈到應用程式商店,並將整個流程自動化。完整的快速入門指南可在此處找到。

以下我們將概述這些步驟。

連接您的儲存庫

Appflow 直接使用 Git 版本控制,並使用您現有的程式碼庫作為部署和套件建置的真實來源。您首先需要與您的託管服務整合,例如 GitHub 或 Bitbucket,或者您可以將程式碼直接推送至 Appflow。完成此操作後,Appflow 將可以存取您的程式碼。

如需更多關於將您的程式碼儲存庫連接至 Appflow 的資訊,請查看 Appflow 文件中的 連接您的儲存庫 章節。

安裝 Appflow SDK

Appflow SDK(也稱為 Ionic Deploy 外掛程式)可讓您充分利用 Appflow 兩個最佳功能:將即時更新部署至您的應用程式並繞過應用程式商店。Ionic Appflow 的即時更新功能隨 Appflow SDK 一起提供,並具有偵測和同步應用程式更新的功能,這些更新是您已推送至儀表板中識別的通道的更新。

若要將 Appflow SDK 外掛程式新增至您的專案,您可以依照 Appflow 儀表板中「部署 > 目的地」區段內點擊「安裝指示」中的安裝說明進行。或者,您可以透過在應用程式的根目錄中執行以下命令來手動安裝外掛程式

ionic deploy add  \
--app-id="YOUR_APP_ID" \
--channel-name="YOUR_CHANNEL_NAME" \
--update-method="background|auto|none" \

如需關於安裝 Appflow SDK 的先決條件和其他說明,請造訪 Appflow 文件中的 安裝 Appflow SDK 章節。

推送提交

為了讓 Appflow 能夠存取您程式碼的最新變更,您需要透過您選擇的版本控制整合來推送提交。對於使用 GitHub 或 Bitbucket 的使用者,這看起來會如下所示

git add . # stage any changes
git commit -m "added appflow sdk" # commit staged changes
git push origin main # push the changes from the main branch to your git host

推送完成後,您將在 Appflow 儀表板的「提交」索引標籤下看到您的提交。如需更多相關資訊,請查看 Appflow 文件中的 推送提交 章節。

部署即時更新

在安裝 Appflow SDK 並將您的提交推送至儀表板後,您就可以將即時更新部署至裝置。即時更新功能會使用安裝的 Appflow SDK 和您的原生應用程式來監聽特定的部署通道目的地。當即時更新被指派至通道目的地時,該更新將部署至執行設定為監聽該特定通道目的地的二進位檔的使用者裝置。

若要部署即時更新,需要建立網頁建置。這可以透過「提交」索引標籤中的「開始建置」圖示或按一下「建置 > 建置」索引標籤右上角的「新增建置」按鈕來完成。選擇要部署的正確提交後,選取「網頁」目標平台和「最新」建置堆疊。根據您的 Appflow 方案,您將能夠包含自訂環境(如果已設定)。最後,您可以啟用「即時更新」並選取通道,以便在建置成功完成後自動將建置指派給該通道。

網頁建置完成後,您可以使用其他版本控制選項。完成此區段並成功部署建置後,您可以將其指派給您在安裝時設定 Appflow SDK 要監聽的相同通道,方法是按一下建置詳細資料頁面中的「部署即時更新」按鈕。也可以透過按一下「建置 > 建置」索引標籤中建置上的「部署即時更新」圖示,並從下拉式選單中選取通道來完成。

若要接收此即時更新,您需要在裝置或模擬器上執行應用程式。最快速且最簡單的方法是透過以下命令

ionic [cordova | cap] run [ios | android] [options]

假設應用程式已正確設定為監聽您部署到的通道,如果您在設定期間選擇自動更新方法,應用程式應該會在啟動時立即更新。如果選擇背景更新方法,請務必停留在應用程式中約 30 秒,以確保已下載更新。然後,關閉應用程式,重新開啟,您將看到已套用的更新!

如需深入瞭解部署即時更新的步驟,以及停用開發部署等其他資訊,請查看 Appflow 文件中的 部署即時更新 章節。

建置原生二進位檔

下一步是您的應用程式建置和部署流程的原生二進位檔。這透過 Ionic Package 服務完成。首先,您需要建立 套件建置。這可以透過「提交」索引標籤中的「開始建置」圖示或按一下「建置 > 建置」索引標籤右上角的「新增建置」按鈕來完成。然後,您將選取您建置的正確提交,並填寫所有數個必填欄位,以及您想要指定的任何選填欄位。填寫所有資訊且建置開始後,您可以查看其進度,並在遇到任何錯誤時檢閱記錄。

如果套件建置成功,iOS 二進位檔 (.ipa 或 IPA) 和/或 Android 二進位檔 (.apk 或 APK) 檔案將可供您使用。您可以透過按一下建置詳細資料頁面右側「成品」區段中的檔案名稱,或按一下「建置 > 建置」索引標籤中建置上的「下載 IPA/APK」圖示,隨後下載檔案,以便將其安裝在裝置上。

關於建置原生二進位檔的更多資訊,可在 Appflow 文件中的 建置原生二進位檔 章節中找到。

建立自動化

自動化 可讓您和您的團隊充分利用 Appflow 的完整 CI/CD 功能。您可以建立自動化,以便在您的團隊將新程式碼提交至指定的分支時,觸發 套件建置部署建置。自動化也可以設定為使用不同的環境和原生設定,以便為開發、暫存、QA 和生產建置不同版本的應用程式。

若要瞭解更多資訊,請瀏覽 Appflow 文件中的「建立自動化」章節。您可以在其中看到有關建立單一自動化的詳細資訊。然而,您可以為不同的分支或工作流程建立多個自動化,並自訂它們以符合您的需求。重要的一點是,只有訂閱基本方案或以上方案的使用者才能建立自動化。

建立環境

可透過環境進一步自訂封裝建置部署建置。這項強大的功能可讓您根據建置時傳入的環境變數建立不同的設定。當與自動化功能結合使用時,開發團隊可以輕鬆設定開發、預備和生產建置組態,讓他們能夠採用 DevOps 最佳實務,並以前所未有的速度發布更高品質的更新。

只有訂閱基本方案或以上方案的使用者才能建立環境。有關此功能的更多資訊,請參閱 Appflow 文件中的「建立環境」章節。

建立原生組態

原生組態可讓您輕鬆修改不同環境(開發、生產、預備等)之間可能會變更的常見組態值,因此您無需使用額外的邏輯或手動將其提交至版本控制。原生組態可以附加到任何封裝建置自動化

原生組態可用於

若要存取建立原生組態的功能,您需要訂閱基本方案或以上方案。有關此功能的更多詳細資訊,請參閱 Appflow 文件中的「建立原生組態」章節。

接下來呢?

恭喜!您已開發出一個完整的跨平台照片庫應用程式,可在網頁、iOS 和 Android 上執行。不僅如此,您還建置了該應用程式並將其部署到使用者的裝置上!

從這裡開始,有很多路可以走。嘗試向應用程式添加另一個 Ionic UI 元件,或更多原生功能。一切皆有可能。新增另一項功能後,再次通過 Appflow 執行建置和部署流程,將其發布給您的使用者。

祝您應用程式開發順利!💙