Angular 4 应用程序可在本地运行但无法在 Github 中加载

Question

这是我第一次尝试创建 Angular 4 应用程序。我创建了一个非常简单的 angular 4 应用程序。它在我的本地正确加载但是当我部署到 github 时，只有 index.html 加载。组件文件不具有约束力。我尝试过的事情 - 确保我已将 docs 文件夹映射到 github。我尝试部署 dist 文件夹而不是源。我已经尝试将 base-href 值更改为“.”、“/”、“”。这是我页面的链接:https://itsy-bitsy.github.io/adventures/我的仓库是 https://github.com/itsy-bitsy/adventures .几天来，我一直试图让它出版，但没有想法。我将非常感谢任何关于我可能做错了什么的见解。

Answer 1

确保进行构建以将必要的文件放入 dist 中。

ng build --prod

首先从应用程序的 Dist 文件夹中获取所有相关文件

对我来说是 Assets 文件夹中的 css 文件 main.bundle.js polyfills.bundle.js vendor.bundle.js

然后将这些文件推送到您创建的存储库中。

1 -- 如果您希望应用程序在根目录上运行 - 创建一个名为 [yourgithubusername].github.io 的特殊 repo，并将这些文件推送到 master 分支中

2 -- 如果您想在不同于根目录的不同分支的子目录中创建这些页面，请创建分支 gh-pages 并将这些文件推送到该分支。

在这两种情况下，我们访问这些已部署页面的方式都不同。

对于第一个案例，它将是 https://[yourgithubusername].github.io对于第二种情况，它将是 [yourgithubusername].github.io/[Repo name].

如果假设你想使用第二种情况部署它，请确保更改 dist 中 index.html 文件的基本 url，因为所有路由映射都取决于你提供的路径，它应该设置为 [/branchname ].

Github 存储库 - https://github.com/rahulrsingh09/Deployment