Web 部署

部署 Dart Web 應用程式就像部署任何其他 Web 應用程式一樣。本頁說明如何編譯您的應用程式、讓應用程式更小更快的秘訣，並指引您取得伺服應用程式的資源。

使用 webdev 工具來建置您的應用程式。它會將 Dart 編譯為 JavaScript，並產生您部署所需的所有資源。當您使用編譯器的生產模式進行建置時，由於編譯器支援 tree shaking，您會得到一個相當小的 JavaScript 檔案。

只需稍作額外的工作，您就可以讓您可部署的應用程式更小、更快且更可靠。

使用 webdev build 命令來建立您應用程式的可部署版本。此命令會將您的程式碼轉換為 JavaScript，並將結果儲存為 build/web/main.dart.js。您可以將任何 dart compile js 可用的選項與 webdev build 一起使用。

以下步驟為選用步驟。它們可以幫助您的應用程式更可靠且反應更靈敏。

• 使用延遲載入來減少應用程式的初始大小
• 遵循 Web 應用程式的最佳實務
• 移除不需要的建置檔案

您可以使用 Dart 對延遲載入的支援來減少應用程式的初始下載大小。如需詳細資訊，請參閱語言導覽中關於延遲載入的涵蓋範圍。

適用於 Web 應用程式的常見建議也適用於 Dart Web 應用程式。以下是一些資源

• 快速載入時間
• Web 基礎知識 (特別是最佳化內容效率)
• 漸進式 Web 應用程式
• Lighthouse

Web 編譯器可以產生在開發期間很有用的檔案，例如 Dart 到 JavaScript 的映射檔案，但在生產環境中是不必要的。

若要移除這些檔案，您可以執行類似以下的命令

# From the root directory of your app:
$ find build -type f -name "*.js.map" -exec rm {} +

您可以像伺服任何其他 Web 應用程式一樣伺服您的 Dart Web 應用程式。本節提供伺服 Dart Web 應用程式的秘訣，以及 Dart 專屬資源，以協助您使用 GitHub Pages 或 Firebase 來伺服您的應用程式。

如果您的應用程式未使用路由或不需要伺服器端支援，您可以使用 GitHub Pages 來伺服應用程式。peanut 套件是一種自動為任何 Dart Web 應用程式產生 gh-pages 分支的簡單方法。

startup_namer 範例是使用 GitHub Pages 託管的。其檔案位於 filiph/startup_namer repo 的 gh-pages 分支中，並使用 peanut 建置。

若要瞭解更多關於使用 Firebase 部署的資訊，請參閱以下資源

• Firebase Hosting 文件說明如何使用 Firebase 部署 Web 應用程式。
• 在 Firebase Hosting 文件中，設定 Hosting 行為涵蓋了重新導向、重寫等等。

除非另有說明，否則本網站上的文件反映的是 Dart 3.7.1 版本。頁面上次更新於 2024-02-07。 檢視原始碼 或 回報問題。