.NET Core + Angular SPA 到 Azure

Question

我一直在嘗試部署具有 Web API 和 Angular SPA（ClientApp 文件夾）的 .net Core 解決方案，我一直在嘗試使用 Visual Studio 代碼部署相同的解決方案，但不知何故它沒有發布應用程序。

到目前為止，我已嘗試遵循以解決該問題

1. ng build --prod
2. ng serve 

它們都可以正常工作。 和應用程序在本地主機上工作。 我也試過下面的命令dotnet publish -c Release -o ./publish; 創建發布文件夾並嘗試發布。 我也嘗試在 dist 文件夾中發布 ClientApp 文件夾。

**請注意，一切都只在一個解決方案中，我想保持這種方式:)**

Answer 1

當您使用ng build --prod命令時，將在/dist/project-name/文件夾下為您創建一個構建項目。 此文件夾的內容包括index.html是您可以在 Web 服務器（ IIS 、 Nginx等）上提供的內容。 如果要部署后端 (.net Core) 和客戶端，則應由 Web 服務器提供服務。 如果您只想測試部署 Angular 應用程序，您可以使用http-server ，它是一個簡單的零配置命令行 http 服務器。 您可以通過以下命令安裝它：

npm install -g http-server

安裝和構建 Angular 應用程序后，打開終端/CMD 和CD到/dist/project-name/那里有index.html並通過以下命令提供它：

http-server -p [PORT]

例如，如果你想在你的localhost和端口8080上提供它，這是命令：

http-server -p 8080

但是，對於生產模式並部署在服務器上，您必須選擇一個 Web 服務器，例如Nginx或IIS並將這兩個應用程序部署到..

為了在 Azure 上部署，在構建 Angular 應用程序之后，這些是一般步驟：

1. 在以下位置創建 Azure 應用服務： Home > App Services
2. 在以下位置配置 Azure 應用服務： Home > App Services > Web App
3. 在以下位置禁用 Application Insights（可選）選項： Home > App Services > Web App
4. 在以下位置查看和創建應用服務： Home > App Services > Web App ，第 4 個選項卡 => Create + Review
5. 使用本地 Git 配置應用服務部署過程
6. 查看您的 Git/部署用戶名和 Git 克隆url
7. 配置 Azure 部署用戶
8. 驗證部署用戶和應用克隆服務的Git Repo
9. 准備本地部署文件夾並克隆 Azure 應用服務 Git 存儲庫
10. 提交部署包並將其推送到 Azure Dev Ops 存儲庫

有關詳細信息，請閱讀這篇有用的文章： 使用本地 Git（CD）將 Angular 8+ 應用程序部署到 Azure 應用服務（PaaS）