在 Gitlab 页面中部署 angular 应用程序时的路径问题

Question

我目前正在测试 angular app/java 微服务后端，我在 Gitlab Pages 上部署了前端。

到目前为止，gitlab-ci.yml 非常简单，因为我只是在测试架构：

cache:
  paths:
    - node_modules/

stages:
  - staging
  
pages:
  image: node:latest
  stage: staging
  script:
    - npm install -g @angular/cli@11.0.1
    - npm install
    - ng build --prod
  artifacts:
    paths:
    - public

我将 angular.json 更改为输出 public/ 而不是 dist/。该站点在地址 https://myaccount.gitlab.io/repository-name 上部署良好，但只有 index.html 有效。

原因是，里面的所有 href 都有些错误：

<script src="runtime.0e49e2b53282f40c8925.js" defer></script>
<script src="polyfills.e6e62ba5ee83d54cee93.js" defer></script>
<script src="main.26f4db6ed1e6241cbf51.js" defer></script>

href 指向 https://myaccount.gitlab.io/runtime.0e49e2b53282f40c8925.js instead of https://myaccount.gitlab.io/repository-name/runtime.0e49e2b53282f40c8925.js，所以我所有的 refs 都抛出 404 错误

有谁知道为什么会这样，以及如何解决？非常感谢！

Answer 1

很抱歉给您带来不便，我找到了一个非常简单的答案来解决我自己的问题，所以我会 post 放在这里以备不时之需。

可以简单地更改 angular 构建的 base-href

--base-href /your-path/

所以我只是像这样更改了我的 ng build :

- ng build --prod --base-href /croquis-time-client/

在 Gitlab 页面中部署 angular 应用程序时的路径问题

path problems when deploying angular app in Gitlab pages

javascript

gitlab

gitlab-pages

angular