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

You should check this https://stackoverflow.com/questions/43994510/react-router-v4-renders-multiple-routes/43994605#43994605 — Shubham Khatri, Jun 25 '18 at 19:02

score 1 · Accepted Answer · answered Jun 25 '18 at 18:43

1

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

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

answered Jun 25 '18 at 18:43

Tholle

83,208
13
152
148

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

1 Answers1