如何在 Azure 上部署 Angular 2 项目答案

【问题标题】：how to deploy angular 2 project on azure如何在 Azure 上部署 Angular 2 项目
【发布时间】：2017-04-29 07:08:01
【问题描述】：

我是 angular2 项目开发的新手。

谁能告诉我如何在 azure 门户上部署 angular2 项目。我已经使用 bitbuket repositoy 在 azure 上部署了我的 angular2 项目。

但是当我访问http://demo.azurewebsites.net 时，它会在浏览器窗口中显示以下错误。

HTTP 错误 502.5 - 进程失败

此问题的常见原因：

申请进程启动失败

应用程序进程启动后停止

应用程序启动但未能监听配置的端口

故障排除步骤：

检查系统事件日志中的错误消息

启用记录应用程序进程的标准输出消息

将调试器附加到应用程序进程并检查

请帮帮我

谢谢

【问题讨论】：

您是否使用 .net 应用程序为 Angular 应用程序提供服务？
是的，我有 2 个应用程序，第一个是 Angular 客户端应用程序，第二个是服务器应用程序，即 asp.net 核心应用程序。我已经在 azure 上部署了 asp.net 核心应用程序。但是现在我必须在 azure 上部署 angular 应用程序，但我不知道如何在 azure 上部署 angular 应用程序。我必须将客户端应用程序与服务器应用程序通信。所以我必须在 azure 上部署 2 个应用程序。
但是您的 Angular 应用程序是否也由 asp.net 应用程序托管？就像你在 Visual Studio 上启动一个 asp.net 应用程序，它会加载 Angular 应用程序？
我的 asp.net 应用程序已经托管在 azure 上。我必须在 azure 上托管我的 angular2 应用程序。
可能需要看看stackoverflow.com/questions/37487046/…

【解决方案1】：

将您的 Angular 应用程序放在 asp.net 应用程序中，这样当您运行 asp.net 应用程序时，它会提供与 Angular 应用程序相同的 index.html 文件，然后将其部署到 azure。

或

像解释here一样将其部署为节点应用程序

【讨论】：

【解决方案2】：

我看到没有多少完整的教程教如何将 Angular 应用程序部署到 azure。这是我的方法，它对我有用。有几种方法，但我更喜欢使用本地 git 将 Angular 应用程序部署到 azure。

您创建一个本地文件夹（假设为“A”）并运行 git init。
转到您要部署的项目文件夹（比如说“B”）并通过 powershell 运行打开文件
ng build --prod --bh "./" 然后它将在您的“B”中创建一个 dist 文件夹。现在你的“B”文件应该有一些捆绑文件......和dist文件夹一侧的资产文件夹。您需要复制所有这些文件并粘贴到本地文件夹“A”中。
假设您已经在 Azure 中拥有该资源（命名为“angularProj”），然后转到概览，您可以看到下面的 Ftp 主机名是您要使用的 URL。你不需要在这里做任何事情，只要确保你已经拥有它设置的资源。
现在您转到资源的部署选项 => 选择 Source => Local Git。填写并单击确定。然后它会显示一条消息，说成功设置部署源。现在转到概述页面，您将看到 git clone 的 FTP 更改。并复制您的 git clone 网址。
转到本地 git 存储库（“A”），然后输入命令：
git add . git commit --message "initial" git remote add original (past your copied url in here) git push original master 现在应该会弹出一个窗口让您输入密码。
转到您的门户面板和部署选项：它处于待处理状态。等几分钟。一旦应用程序设置成功。转到概述单击 URL，您应该能够看到与 localhost 项目完全相同的网页。

补充： 7.你也可以去customer domain设置自己的域名映射到azure。

我不是母语人士，我已尽力解释我想表达的意思。希望它对您有所帮助和工作。

【讨论】：