首页 > 解决方案 > Angular Polyfills 和其他 6 个 index.html 文件路径错误

问题描述

我正在 IIS 上部署角度构建,我认为我的主要问题是基础问题

这是我在 IIS 管理器中托管 Angular 构建的路径

First ClientApp 是我在 IIS 上的应用程序

E:\IIS Projects\ElasticCoreWebAPI_Public\feature\ClientApp\ClientApp\ 这是我建的

这是我的 index.html


<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>KEENU CFRS</title>
  <base href="/ClientApp">
  <!--// "build": "ng build --base-href=/CFRS.WebUI/",-->

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap" rel="stylesheet">
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>
<body class="mat-typography">
  <app-root>
      <div class="main-spinner-wrapper">
        <div class="donut"></div>
      </div>
  </app-root>
</body>
</html>

这是我的 package.json

  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },

这是我的构建发布命令

ng build --prod --base-href /ClientApp/

这就是建造的地方

  "options": {
            "outputPath": "dist",
            "index": "src/index.html",
            "main": "src/main.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "tsconfig.app.json",

我在 dist 建立我的

这是我构建的输出图片 在此处输入图像描述

标签: angular

解决方案


如果构建部署在根文件夹中,然后在 index.html 中,我通过给出部署构建的服务器地址来解决它

<base href="/">

如果网站部署在应用程序的物理文件夹内的某个位置,那么当应用程序是浏览器时,从 Url 复制除根文件夹之外的 Url,那么这就是您的 WebsiteAddress

<base href="/WebSiteAddress">

如果构建部署在根文件夹中,则用于进行生产构建的命令

ng build --prod 

如果网站部署在应用程序的物理文件夹中,那么

ng build --prod --base-href /WebSiteAddress/

推荐阅读