React app deployment on GitHub Pages displays a blank page
I've developed a react app that is running fine locally. I'm now trying to deploy it using GitHub Pages.
Despite following this tutorial, I get a blank page, and several 404 errors in the logs.
Here is my index.js
:
import React from 'react';
import ReactDOM from 'react-dom/client';
import {HashRouter} from "react-router-dom";
import './index.css';
import App from './App';
ReactDOM.createRoot(document.getElementById('root')).render(
<React.StrictMode>
<HashRouter>
<App />
</HashRouter>
</React.StrictMode>
);
And the Route defined in App.js
return (
<>
<Navbar/>
<Routes>
<Route path='/' element={<CoinsTable coins={coins}/>}/>
<Route path='/coin' element={<CoinDetails/>}>
<Route path=':coinId' element={<CoinDetails/>}/>
</Route>
<Route path='/option-prices' element={<CoinOptionsTable/>}>
<Route path=':coinId' element={<CoinOptionsTable spotValue={1500} />}/>
</Route>
</Routes>
</>
);
Here is the homepage
property I've added to the project's package.json
:
"private": false,
"homepage": "https://myusername.github.io/myusername/myappname",
I've added this to scripts
:
"predeploy": "npm run build",
"deploy": "gh-pages -d build",
Then I run this command to deploy the app:
npm run deploy
Comments
Post a Comment