網頁部署

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

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

只需稍加努力，您就可以使您的可部署應用程式更小、更快且更可靠。

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

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

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

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

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

• 快速載入時間
• 網頁基礎 (尤其是最佳化內容效率)
• 漸進式網頁應用程式
• Lighthouse

網頁編譯器可以產生在開發期間有用的檔案，例如 Dart 到 JavaScript 的對應檔案，但在生產環境中則不需要。

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

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

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

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

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

若要深入瞭解如何使用 Firebase 部署，請參閱下列資源

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

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