在 Azure Web 应用程序 URL 重写问题中托管 Angular 7

Question

我在 Azure 中创建了一个 webapp 来托管我的 Angular 7 站点。但是我有一个问题，网站上没有显示背景图片。

它在本地运行良好。

在控制台中，我收到以下错误：无法加载资源：服务器响应状态为 500（URL 重写模块错误。）

这是我的 web.config 文件：

<configuration>
    <system.webServer>
      <rewrite>
        <rules>
          <rule name="Angular" stopProcessing="true">
            <match url=".*" />
            <conditions logicalGrouping="MatchAll">
              <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
              <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
            </conditions>
            <action type="Rewrite" url="/" />
          </rule>
        </rules>
      </rewrite>
    </system.webServer>
</configuration>

背景图像位于 /assets/images/ 如果我尝试直接转到图像路径，则会出现此错误：

我需要帮助找出背景不显示的原因以及我做错了什么

Answer 1

我发现了问题。当角度应用程序构建时

ng build --prod

部署了两个 web.config 文件。一个在根文件夹中，一个在assets 文件夹中。

我发现这是因为 angular.json 文件中有这个配置。

解决方案是从配置中删除标记的行：

    "assets": [
      "src/assets",
      "src/favicon.ico",
      "src/web.config" <---- Removed this line
    ],

希望这可以帮助某人。