英文:
React Site Builds and Deploys Successfully, but shows up as a blank white page
问题
所以我是新手网页开发，我一直在构建一个React网站，只是为了试试看。在本地运行得很好，所以我按照教程将其托管到了GitHub上。构建和部署过程顺利进行，似乎没有什么问题。然后我尝试打开网站，但只有一个空白的白色页面，检查告诉我：
无法加载资源：服务器以状态404响应（）
这是完整的仓库链接
我尝试将它推送到一个全新的GitHub仓库，以防万一在Git中出现了什么问题。除此之外，我没有尝试太多，一直陷入困境:(
英文:
So I'm new to web dev and I've been building a React site just to try it out. It worked great locally, and so then I followed a tutorial to get it hosted on github. The build and deploy process goes smoothly, nothing seems wrong. Then I try to open the site and it's just a blank white page and inspect is telling me.
Failed to load resource: the server responded with a status of 404 ()
Here is the full repo
I tried pushing it to a fresh github repo, on the off chance something just went wrong within git somehow. Other than that, I haven't tried too much and have been really stuck 
答案1
得分: 0
你似乎在使用一个GitHub工作流程，实际上没有构建你的内容。当查看你的操作（GitHub的一个功能，可以为你构建网站）时，我发现在渲染时使用了Jekyll（一个静态网站生成器）。它只找到了你的资源和index.html文件，这就是你在浏览器中看到的内容。在这种情况下，这是错误的，因为你想要使用Vite而不是Jekyll来构建网站。Vite有一篇关于将静态网站部署到GitHub Pages的文章链接在这里。
英文:
You seem to be using a GitHub workflow that's not actually building your content. When looking into your Actions (the feature of GH that can build your site for you) I found that Jekyll (a static site generator) is used for rendering. It only finds your assets and the index.html file, which is what you're seeing in the browser. In this case, that's wrong since you want to use Vite and not Jekyll to build the site. Vite has an article on deploying your static site to GH Pages here.
答案2
得分: 0
根据我注意到的情况，您已将src/main.tsx文件声明为处理应用程序的根节点的主文件。
在createRoot()中，您正在获取document.getElementById("root")，但有一个意外的!，不应该存在。
createRoot()应该像这样编写：-
ReactDOM.createRoot(document.getElementById("root")).render(
<React.StrictMode>
</React.StrictMode>
);
英文:
As I can notice, you have declared src/main.tsx file as the main file that deals with root node of your application.
In the createRoot() where you are fetching document.getElementById("root") , there is unexpected ! that should not be there.
the createRoot() is expected to be written like this:-
ReactDOM.createRoot(document.getElementById("root")).render(
<React.StrictMode>
<App />
</React.StrictMode>
);
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论