[英]React js not found/blank page on refresh page
我知道這是一個常見問題,我在 stackoverflow 中嘗試了一些答案,但在我的情況下它還沒有奏效。
我在使用yarn build
的共享主機中有一個應用程序。 當我刷新頁面時,會按預期顯示404
錯誤。 所以我閱讀了這個文檔並創建了一個 .htaccess 文件,代碼如下:
Options -MultiViews
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [QSA,L]
我將它添加到項目的根文件夾中。 現在一切正常。
我的管理面板有第二個版本,位於子目錄: https://example.com/Admin/Login ,我在登錄目錄中提供管理應用程序。
所以我在刷新頁面時遇到了同樣的問題。 例如https://example.com/Admin/Dashboard 。
如果我刷新https://example.com/Admin/Login它會加載頁面並且工作正常,但刷新https://example.com/Admin/Dashboard我會得到一個空白頁面。
我什至使用位於public
目錄中的相同 .htaccess 文件構建管理面板,該文件在構建過程后復制到構建文件夾,但它不起作用。 我總是得到一個空白頁。
我在這里閱讀了一些答案,但它還沒有工作。
路線.js:
import React from 'react';
import { BrowserRouter, Switch, Route } from "react-router-dom";
import Login from './pages/Login';
import Admin from './pages/Dashboard';
export default function Routes() {
return (
<BrowserRouter>
<Switch>
<Route path="/Admin/Login" exact component={Login} />
<Route path="/Admin/Dashboard" component={Manager} />
</Switch>
</BrowserRouter>
);
}
package.json:
{
"name": "dashboard",
"homepage": "https://example.com/Admin/Login",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.11.4",
"@testing-library/react": "^11.1.0",
"@testing-library/user-event": "^12.1.10",
"axios": "^0.21.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-icons": "^4.2.0",
"react-input-mask": "^2.0.4",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.3",
"web-vitals": "^1.0.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
還有什么我應該做的嗎?
我通過將登錄文件夾內容移動到根目錄( https://example.com/Admin )使其工作,以便在其上加載登錄表單,然后我離開 .htaccess 相同。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.