时间戳

首页 > 解决方案 > 无法将 Angular 8 CLI 应用部署为 Azure 应用服务

angular - 无法将 Angular 8 CLI 应用部署为 Azure 应用服务

问题描述

我正在使用 Angular 8 和 Asp.Net Core 2.1。我首先使用 Visual Studio 模板创建了我的 Asp.Net Core 应用程序。然后我在 repo 文件夹中打开了一个命令提示符，并使用 ng create MyClientApp 创建了我的 Angular 应用程序。我现在使用 Visual Studio Code 来管理我的应用程序的 Angular 部分。如果我在本地运行应用程序，一切正常。我正在尝试将 Angular 应用程序部署到运行 .NET v4.7 框架的 Azure 应用程序服务。

客户端在 localhost:4200 上运行

api 在 localhost:5849/api 上运行

我现在正在尝试将 Angular 应用程序部署为 Azure 应用程序服务，但我无法让它工作。

有谁知道使用 Visual Studio Code 部署应用程序的简单方法？理想情况下，我想使用 Azure App Service 扩展。

节点 = v10.14.0

NPM = 6.4.1

我注意到如果我运行 ng build，它会构建完整的 dist 文件夹。如果我运行 ng build --prod，它不会构建完整的 dist 文件夹。我看到大约 40 个这样的错误。

src/app/content/content.component.html(157,25) 中的错误：：属性“userService”是私有的，只能在“ContentComponent”类中访问。

src/app/content/content.component.html(91,122): : 类型“ContentComponent”上不存在属性“过滤器”。

我还注意到，根据 Azure 控制台，我的应用服务为 node 运行 v0.10.40，为 npm 运行 1.4.28。我添加了这个 WEBSITE_NODE_DEFAULT_VERSION 10.14.0，但这不起作用。

我希望这样的事情会奏效。这适用于 ng build，但对我不起作用。 https://dzone.com/articles/deploy-an-angular-app-from-visual-studio-code-to-a-1

更新 1：看起来不支持节点 v10.14.0。我现在在我的 Angular 应用程序中运行 v10.14.1，控制台反映了这一点，但它仍然无法正常工作。我正在尝试查看它是否给出任何错误。

任何帮助深表感谢。谢谢！

标签： angularasp.net-coreazure-web-app-service

解决方案

我终于得到了这个工作。关键是确保在部署应用程序时选择 dist 文件夹 (dist\myclientapp) 中的文件夹。然后我必须使用 FTP 将以下 web.config 添加到 wwwroot 文件夹。最后一步是重新启动应用程序。

<configuration>
<system.webServer>

<!-- indicates that the index.js file is a node.js application 
to be handled by the iisnode module -->

<handlers>
  <add name="iisnode" path="index.js" verb="*" modules="iisnode" />
</handlers>

<!-- adds index.js to the default document list to allow 
URLs that only specify the application root location, 
e.g. http://mysite.azurewebsites.com/ -->

<defaultDocument enabled="true">
  <files>
    <add value="index.js" />
  </files>
</defaultDocument>

</system.webServer>
</configuration>

推荐阅读