React 站点构建和部署成功，但显示为空白页

Question

所以我是网络开发新手，我一直在构建一个 React 网站只是为了尝试一下。它在本地运行得很好，所以我按照教程将其托管在 github 上。构建和部署过程都很顺利，没有出现任何问题。然后我尝试打开该网站，它只是一个空白的白页，检查告诉我。

Failed to load resource: the server responded with a status of 404 ()

这是完整的repo

我尝试将其推送到一个新的 github 存储库，以防 git 中出现某种问题。除此之外，我还没有尝试太多，而且真的被困住了:(

Answer 1

您似乎正在使用 GitHub 工作流程，但实际上并未构建您的内容。在查看您的 Actions（可以为您构建网站的 GH 功能）时，我发现 Jekyll（静态网站生成器）用于渲染。它只会找到您的资产和

index.html

文件，这就是您在浏览器中看到的内容。在这种情况下，这是错误的，因为您想使用 Vite 而不是 Jekyll 来构建网站。 Vite 有一篇关于将静态站点部署到 GH Pages 的文章这里。

Answer 2

正如我所注意到的，您已将

src/main.tsx

文件声明为处理应用程序

root node

的主文件。

在您获取

createRoot()

的

document.getElementById("root")

中，出现了不应该出现的意外

!

。

createRoot()

预计会这样写：-

ReactDOM.createRoot(document.getElementById("root")).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);