时间戳

首页 > 解决方案 > Angular：使用“GitHub”页面重新加载后获取“404”

angular - Angular：使用“GitHub”页面重新加载后获取“404”

问题描述

我已经Angular在页面上部署了我的网站GitHub，但我遇到了问题。

以下是我的route设置：

const routes: Routes = [
  { path: '', redirectTo: 'main', pathMatch: 'full' },
  { path: 'main', component: AppMainComponent }
];

以下是我的部署命令：

- name: Build
        run: |
          npm install -g @angular/cli
          npm install
          ng build --prod --base-href=https://[user-name].github.io/[project-name]/
        
- name: Deploy
        uses: JamesIves/github-pages-deploy-action@releases/v2
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          BASE_BRANCH: master
          BRANCH: gh-pages
          FOLDER: dist/[project-name]

如果我转到我的GitHub页面“https://[user-name].github.io/[project-name]/”，它工作正常并重定向到“https://[user-name].github.io /[项目名称]/main" 成功。但是在我点击浏览器的重新加载按钮后，它显示404 page not found给我。

我的 Angular 版本是 9.1.8。

谢谢！

标签： angulargithub-pages

解决方案

根据 Angular文档，您必须复制index.html并命名它404.html。

  1. 构建完成后，复制 docs/index.html 并将其命名为 docs/404.html。

bash ng build --prod --output-path docs --base-href/<project_name>/

推荐阅读