Github页面显示空白页。

Question

我的代码库：https://github.com/something/personal_website 我的网站：https://website.com/

我无法弄清楚为什么我的GitHub页面无法加载任何源文件。我想要加载的文件在src文件夹中。在本地主机上一切正常。它只加载index.html，这是一个白色空白的屏幕，我没有在这个文件中编写任何内容。我看到了一些关于此问题的相似帖子，但没有发现任何共同之处。

我通过npm安装了gh-pages模块并运行“npm run deploy”；这创建了我的gh-pages分支。我已使用适当的信息更新了package.json。据我所知，我的代码库中没有大写字母。

我先前曾在该域上使用Github Pages托管另一个网站，没有任何问题。自那以后，Github页面和过程似乎已经发生了变化，我无法让它工作。

- J R

Answer 1

问题在于你的主页正在尝试从 https://something.com/personal_website/static/js/main.3edbf089.chunk.js 加载资源，而不是从 https://something.com/static/js/main.3edbf089.chunk.js 加载资源。

从 package.json 中移除 homepage 的 personal_website 扩展名，路由应该就可以正常工作了。

因此，你的新 package.json 应该如下所示：

{
  "homepage" : "https://something.github.io/",
  "name": "my-website",
  "version": "0.1.0",
  ...

- Robbie JW

---

行了！非常感谢，你不知道这个问题困扰了我多久。 - J R

它对我没用。 - Rahul Khanna

对我来说很有效！现在的问题是为什么那么多教程（包括GitHub的）都是错误的呢？ - 101is5

Answer 2

1. 确保你的 package.json 文件包含以下内容:

   "homepage": "https://username.github.io/appname"

2. 如果你使用 BrowserRouter，请设置 basename:

   <BrowserRouter basename={process.env.PUBLIC_URL}>

3. 在部署时，你的 .env 文件不能包含类似于 PUBLIC_URL=/ 的内容（这是我遇到的问题）

- Michał Skwara

Answer 3

我被这个问题困扰了两天，终于解决了。

在本地工作正常，但是部署后打开空白页面。

问题出在我们更改了主页路径。因此，我们需要更新代码中的路径。

以我的情况为例，我将主页添加到“package.json”文件中：

"homepage": "https://[YourGitHubAccountName].github.io/[YourProjectName]"

所以添加了这个之后，应用程序不能工作，因为我的代码中的路径需要更改。

例如： '/' 路径应该变成 '/[YourProjectName]' 或者 '/test' 应该变成 '/[YourProjectName]/test'

- RecepU

---

这并没有回答问题。一旦您拥有足够的声望，您就可以评论任何帖子；相反，提供不需要询问者澄清的答案。- 来自审核 - mcky

Answer 4

将 "homepage": "https://myusername.github.io/my-app" 添加到您的 Package.JSON 可能会解决您的问题。请记得替换您的 Github 用户名和应用程序名称。

- Sanjeeb

Answer 5

大多数答案都是为了解决create-react-app的问题。 当使用vite时，您需要在vite.config.js中设置正确的base，如下所示。 此外，请注意，在vite中，您不需要在“package.json”文件中使用“homepage”键。

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
  plugins: [react()],
  base: "/<REPO_NAME>/",
})

想要了解更多信息，请参考Vite的gh-pages配置

- Kayphaz007