What should I change in my config/routes.js
file to make it use modules/router
files written for the React front-end ?
config/routes.js file:
module.exports: {}
module/router.js:
import React from 'react'
import { Route, IndexRoute } from 'react-router'
import App from './App'
import About from './About'
import Repos from './Repos'
import Repo from './Repo'
import Home from './Home'
module.exports = (
<Route path="/" component={App}>
<IndexRoute component={Home}/>
<Route path="/repos" component={Repos}>
<Route path="/repos/:userName/:repoName" component={Repo}/>
</Route>
<Route path="/about" component={About}/>
</Route>
)
I am using webpack, babel for bundling. Really stuck with this.
Currently, the first page is rendered by assets/index.html
but if I refresh from any other page (whose address is not /
), I get 404 from the server, even though the path is defined in the react router file.
Please help.
EDIT
Here's my index.js
file (serves as the React entry point):
import React from 'react'
import { render } from 'react-dom'
import { Router, browserHistory } from 'react-router'
import routes from './routes'
render(
<Router routes={routes} history={browserHistory}/>,
document.getElementById('app')
)