React APP与部署在GH页面上的Firebase的路由和授权显示空页面



我有一个react应用程序,里面有Routes和Firebase的Authorization模块。我之前成功地将简单的React应用程序部署到GH Pages。观看YT教程,并尝试使用HashRouter和BrowserRouter部署当前应用程序,但没有成功。

如何正确部署?GitHub,谷歌没有提供对我有帮助的答案。

Git:https://github.com/TyroniUA/X-Culture

包.json

"homepage":"https://tyroniua.github.io/X-culture/",
"scripts": {
"start": "node scripts/start.js",
"build": "node scripts/build.js",
"test": "node scripts/test.js",
"predeploy": "npm run build",
"deploy":"gh-pages -d build"
},

App.JS,其中Auth&路线:

import { HashRouter as Router, Switch, Route } from "react-router-dom"
import { AuthProvider } from "./FireBase/Auth";
/// some imports later 
function App() {
return (
<AuthProvider>
<Router>
<NavBar title='volodymyr' />
<Switch>
<Route path='/' exact render={(props) => <Main/>} />
<Route path='/admin' exact component={Admin} />
<PrivateRoute path='/AdminDashboard'exact component={AdminDashboard} />
<Route path='/training' component={Training} />
<Route path='/business' component={Business} />
<Route path='/research' component={Research} />
<Route path='/coach' component={Coach}/>
<Route path='/team' component={Team} />
<Route path='/symposium' component={GSymp}/>
<Route path='/blog' component={Blog} />
<Route path='/winners' component={Winners} />
<Route path='/hackaton' component={Hackaton} />
</Switch>
<Footer />
</Router>
</AuthProvider>
);
}

我不确定我到底是如何解决这个问题的,但我做到了。

我什么都做:*HashRouter而不是BrowserRouter*Package.json中的主页,但在"X-culture"中具有较低的X

它奏效了。

最新更新