構建 Angular 應用程式以及更多資源
這篇文章是 Angular 的最後一篇,它涵蓋了如何構建一個可以投入生產使用的應用程式,並提供了一些額外的資源供你繼續學習之旅。
| 先決條件 | 熟悉核心 HTML、CSS 和 JavaScript 語言,瞭解 終端/命令列。 |
|---|---|
| 目標 | 學習如何構建 Angular 應用程式。 |
構建完成的應用程式
現在你已經完成了應用程式的開發,你可以執行 Angular CLI 的 build 命令。當你在 todo 目錄中執行 build 命令時,你的應用程式會編譯到一個名為 dist/ 的輸出目錄中。
在 todo 目錄中,在命令列中執行以下命令
bash
ng build -c production
CLI 會編譯應用程式並將輸出放到一個新的 dist 目錄中。--configuration production/-c production 標誌與 ng build 一起使用,可以去除生產環境中不需要的東西。
部署您的應用程式
要部署應用程式,你可以將 dist/my-project-name 資料夾的內容複製到你的 Web 伺服器上。由於這些檔案是靜態的,你可以將它們託管在任何能夠提供檔案的 Web 伺服器上,例如
- Node.js
- Java
- .NET
你可以使用任何後端,例如 Firebase、Google Cloud 或 App Engine。
本地主機
為了好玩,你可以使用 http-server 包在你的機器上託管構建後的應用程式,方法是在執行構建後執行以下命令
bash
npx http-server ./dist/todo/browser/ -o
此命令在埠 8080 上提供 dist/todo/browser 目錄,因此你可以在瀏覽器中開啟 http://127.0.0.1:8080 來檢視正在執行的應用程式。HTTP 伺服器還允許你從本地網路上的任何其他裝置訪問應用程式的 IP 地址,該地址在控制檯中 127.0.0.1 地址下列出。