Angular 应用程序部署到 IIS - 不显示图像（静态 URL）答案

【问题标题】：Angular app deployment to IIS - Images not displaying (Static URLs)Angular 应用程序部署到 IIS - 不显示图像（静态 URL）
【发布时间】：2020-06-01 08:36:25
【问题描述】：

我正在将 Angular 6 应用程序部署到 IIS。我安装了 IIS 重写模块，还使用基本 URL 和重写规则更新了 web.config 文件和 index.html 文件。

问题是登录页面显示时没有徽标/图像。我试着看看出了什么问题。 http://localhost/ATSTV2/#/login（这会显示带有控件但没有图像的登录页面）

我查看了引用的图片网址，它显示的来源为http://localhost/assets/Logo_White.png，这是不正确的。正确的图片链接是http://localhost/ATSTV2/assets/Logo_White.png

除了更改基本 URL 的 web.config 和 index.html 之外，我是否应该进行一些全局更改并确保正确引用静态 URL？

整个应用程序可以在本地使用 angular CLI ng serve 运行良好。但是在部署到服务器时，我将其部署到 IIS，因此在互联网上遵循了一些建议的方法。

【问题讨论】：

您的路由是否正常工作？
是的。我能够使用我的菜单选项和其他控件显示导航并且工作正常
随时发布您的解决方案并将其标记为答案，以帮助遇到此问题的任何人。 stackoverflow.com/questions/51182322/…

标签： angular image url iis deployment

【解决方案1】：

您可以使用deploy-url 选项来指定加载js/css 文件的url。

ng build ... --deploy-url /ATSTV2/

编辑

尝试修改angular.json文件并将deployUrl : "/ATSTV2/设置为projects->YourProjectName->architect->build->options

 "projects": {
    "YourProjectName": {
      ...
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            ...
            "deployUrl" : "/ATSTV2/",

【讨论】：

嗨，大卫。部署 url 选项不能解决问题
之后的 logo url 是什么？
在我的页面中 IIS 使用 localhost/assets/Logo_White.png 作为不正确的 URL。正确的图像链接是 localhost/ATSTV2/assets/Logo_White.png。我不确定为什么 IIS 使用 url localhost/assets/Logo_White.png 而不是 localhost/ATSTV2/assets/Logo_White.png
@SARAVAN 很奇怪，有点忽略了这个选项。我编辑了我的帖子，你可以试试这个吗？
按照您的要求进行更改。但仍然是同样的问题。我正在使用 angular.json 中架构师构建部分的截图来编辑我的问题。如果你发现了什么，请告诉我。

【解决方案2】：

使用命令构建

ng build --base-href="/ATSTV2/"

【讨论】：

你好 Aakashgarg - 照你说的做了。但还是同样的问题
现在资产路径在 iis 上变成了什么？
IIS 使用 localhost/assets/Logo_White.png 这是不正确的。正确的图片链接是localhost/ATSTV2/assets/Logo_White.png
尝试构建 --base-href /ATSTV2/
你好阿卡什。这是否类似于您之前在答案中的命令？