使用GitHub Actions部署Angular项目出现404问题求助

1. 构建产物路径配置错误 #

你的deploy.yml中publish_dir设置为./dist，但Angular执行ng build后，即使angular.json里outputPath设为dist，最终构建产物仍会生成在dist/[项目名称]的子目录下（你的项目名称为angular-crud，所以产物实际在dist/angular-crud中）。

修改deploy.yml里的部署路径配置：

- name: Deploy to GitHub Pages
  uses: peaceiris/actions-gh-pages@v3
  with:
    github_token: ${{ secrets.GITHUB_TOKEN }}
    publish_dir: ./dist/angular-crud

2. 确认GitHub Pages源设置 #

进入项目GitHub仓库的Settings → Pages页面，检查Source区域：

• 分支需选择gh-pages
• 目录需选择/(root)

若目录选了其他选项（如/docs），会导致无法找到根目录下的index.html，从而返回404。

3. 验证gh-pages分支内容 #

查看你的gh-pages分支，确认根目录下直接存在index.html、main.[hash].js等构建产物文件，而非嵌套在dist或其他子目录中。如果分支里的文件都在子目录下，说明publish_dir路径错误，导致部署的是目录本身而非内部文件。

内容的提问来源于stack exchange，提问作者El Hombre Sin Nombre