React Router not rendering path='/' when I publish to custom domain in github

Question

I have a repo in GitHub and I have set the custom domain to www.alessiochf.com

The app is not rendering the home Route as per below code

import React from 'react' import { Switch, Route } from 'react-router-dom' import Home from './Home' import About from './About' import PhotoApp from './PhotoApp' import ScrollToTop from './scrollToTop' const Main = () => ( <main> <Switch> <ScrollToTop> <Route path='/' component={Home}/> <Route path='/PhotoApp' component={PhotoApp}/> <Route path='/About' component={About}/> </ScrollToTop> </Switch> </main> ) export default Main

Here is my Package.json file

{ "name": "alessioch", "description": "Portfolio in React.js", "homepage": "http://www.alessiochf.com", "version": "0.0.0", "dependencies": { "react": "15.5.3", "react-dom": "15.5.3", "react-router-dom": "4.1.1", "react-scroll-parallax": "^1.3.5", "surge": "^0.20.1" }, "devDependencies": { "gh-pages": "^1.2.0", "react-scripts": "1.0.0" }, "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test --env=jsdom", "eject": "react-scripts eject", "predeploy": "npm run build", "deploy": "gh-pages -d build" } }

Am I missing something? Thanks

Do you get a different result with <Route exact path='/' component={Home}/>? — Tholle
– Tholle, Commented Jun 25, 2018 at 18:37
You should check this stackoverflow.com/questions/43994510/… — Shubham Khatri
– Shubham Khatri, Commented Jun 25, 2018 at 19:02

Tholle · Accepted Answer · 2018-06-25 18:43:37Z

1

Make sure you set the exact prop to true on your Home route:

<Route exact path='/' component={Home}/>

answered Jun 25, 2018 at 18:43

Tholle

113k22 gold badges209 silver badges198 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Abraham · Accepted Answer · 2021-08-05 18:27:41Z

Better to move it to the bottom, rather than using exact. so that it would redirect all other random paths to /

 <ScrollToTop> <Route path='/PhotoApp' component={PhotoApp}/> <Route path='/About' component={About}/> <Route path='/' component={Home}/> </ScrollToTop>

The question is 3y old so your solution might be cleaner and more up to date. I will check when I have a chance

Collectives™ on Stack Overflow

React Router not rendering path='/' when I publish to custom domain in github

2 Answers 2

Comments

1 Comment

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Linked

Related