我正在制作一個帶有 react 的電子商務網站，并將網站上傳到 Github 頁面，部署作業正常，但是當我單擊導航按鈕轉到網頁的不同部分并重新加載頁面時，會出現錯誤 404：
Failed to load resource: the server responded with a status of 404 ()
在本地主機中它完全正常。我是否需要再次將我的網站部署為新專案？我一直以相同的方式上傳網站，我沒有遇到這個問題。我實作了我的谷歌瀏覽器，會不會有兼容性問題？非常感謝！
uj5u.com熱心網友回復：
在您的 package.json 中添加一個帶有值的欄位名稱
"homepage":"."
在公共內部以及您的構建檔案夾中創建一個檔案，_redirects在其中撰寫此代碼
/* /index.html 200
uj5u.com熱心網友回復：
注意：我假設您正在使用create-react-appJSX 并且react-router-dom像這樣：
<BrowserRouter>
<Routes>
<Route exact path="/" element={<HomePage />} />
<Route path="cart" element={<CartPage />} />
<Route path="settings" element={<SettingsPage />} />
</Routes>
</BrowserRouter>
嗯，GitHub Pages 中的 HTTP 路由與npm start在本地機器中使用命令的作業方式不同。幸運的是，背后的開發create-react-app 者已經解釋了這背后的技術原因：
如果您使用在底層使用 HTML5
pushState歷史 API的路由器（例如，帶有 browserHistory 的React Router），許多靜態檔案服務器將失敗。例如，如果您使用帶有路由的 React Router for/todos/42，開發服務器將localhost:3000/todos/42正確回應，但服務于上述生產構建的 Express 不會。這是因為當 a 有新的頁面加載時
/todos/42，服務器會查找該檔案build/todos/42但找不到它。服務器需要配置為/todos/42通過服務回應請求index.html。
是的，GitHub Pages 也算作靜態檔案服務器，并期望這些路由可作為單獨的靜態檔案使用（例如build/cart.html用于/cart路由），這里的目標是欺騙 GitHub Pagesindex.html為所有這些路由提供服務。但是，目前無法在 GitHub Pages 端解決此問題，例如通過應用.htaccess組態檔（因為 GitHub Pages 不使用 Apache Web Server）或轉到 GitHub 上的存盤庫設定。
那么，在這里可以做什么？上面的代碼片段使用<BrowserRouter>，已知它與托管 GitHub Pages 不兼容。好訊息是，許多人建議替換<BrowserRouter>into <HashRouter>，它幾乎可以在所有靜態檔案服務器中作業（請參閱此處的技術原因）。有一篇關于如何設定<HashRouter>React 專案并將其發布到 GitHub Pages的專門 FreeCodeCamp 文章。
注意：一旦您將其替換為<HashRouter>，您將需要處理 HTML/JSX 標簽中現有的硬編碼路徑，因為<HashRouter>使用舊的 HTML 錨點/ID 標簽（例如#menu）。這意味著<a href="/cart">在您的 React 應用程式中必須替換為<a href="#/cart">（注意#那里的附加哈希/字符），否則它將再次回傳 404。
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/401030.html