Angular 部署應(yīng)用

部署應(yīng)用

部署應(yīng)用是指編譯或構(gòu)建代碼并將生成的 JavaScript、CSS 和 HTML 托管到 Web 服務(wù)器上的過程。

本節(jié)基于“入門”教程中的前序步驟，并向你展示如何部署應(yīng)用。

先決條件

這里的最佳實踐是在部署項目之前先在本地運行項目。要在本地運行項目，你需要在計算機上安裝以下軟件：

• Node.js
• Angular CLI。在終端上，使用以下命令全局安裝 Angular CLI：

npm install -g @angular/cli

借助 Angular CLI，你可以使用 ?ng ?命令創(chuàng)建新的工作區(qū)、新項目、在開發(fā)過程中啟動開發(fā)服務(wù)器，或生成要共享或分發(fā)的構(gòu)建成果。

在本地運行你的應(yīng)用

1. 在左邊的菜單中點擊 ?Project ?后面的 ?Download Project? 圖標(biāo)，以下載你的 StackBlitz 項目源代碼的 zip 包。




2. 解包，并進入新創(chuàng)建的這個項目目錄中。比如：

cd angular-ynqttp

3. 使用以下 CLI 命令在本地運行你的應(yīng)用：

ng serve

4. 要在瀏覽器中查看你的應(yīng)用，請訪問 ?http://localhost:4200/?。如果默認端口 4200 不可用，則可以使用端口標(biāo)志指定另一個端口，如下所示：

ng serve --port 4201

當(dāng)啟動了應(yīng)用的開發(fā)服務(wù)器時，你可以編輯代碼并在瀏覽器中查看對此更改的自動更新。要停止此 ?ng serve? 命令，請按 ?Ctrl + c? 鍵。

構(gòu)建和托管你的應(yīng)用

1. 要構(gòu)建用于生產(chǎn)的應(yīng)用，請使用 ?build ?命令。默認情況下，此命令使用 ?production ?構(gòu)建配置。

ng build

此命令會創(chuàng)建一個 ?dist ?文件夾，其中包含把你的應(yīng)用部署到托管服務(wù)時所需的全部文件。

如果上述 ?ng build? 命令引發(fā)了“缺少軟件包”之類的錯誤，請將缺失的依賴項附加到本地項目的 ?package.json? 文件中，以匹配從 StackBlitz 下載的項目中的依賴項。

2. 把 ?dist/my-project-name? 文件夾的內(nèi)容復(fù)制到 Web 服務(wù)器。由于這些文件是靜態(tài)的，因此你可以將它們托管在任何支持靜態(tài)文件的 Web 服務(wù)器上。（例如 Node.js、Java、.NET 或任何后端（例如Firebase，Google Cloud 或 App Engine）)。