I cannot access the DOM with the implementation of a responsive, responsive, and responsive router server. I either have a ReferenceError: the document is not defined, or DOM errors are needed for browser history.
Server Record:
module.exports = function( req, res, next ) { match({ routes, location: req.url }, (error, redirectLocation, renderProps) => { if (error) { res .status(500) .send(error.message); } else if (redirectLocation) { res.redirect(302, redirectLocation.pathname + redirectLocation.search); } else if (renderProps) { res .status( 200 ) .set( 'Content-Type', 'text/html' ) .send( '<!doctype html>' + renderToString( [ <RoutingContext {...renderProps} />, <HtmlDocument /> ] ) ); } else { res .status(404) .send('Not found'); } }) };
client.js:
import { render } from 'react-dom'; import routes from './routes'; render( routes, document.getElementById('app') )
routes.jsx:
import React from 'react'; import { Router, Route, IndexRoute } from 'react-router'; import createBrowserHistory from 'history/lib/createBrowserHistory'; import Application from './Application'; import Index from './pages/index'; import App from './pages/app'; import Auth from './pages/auth'; import Login from './pages/auth/components/Login'; import Signup from './pages/auth/components/Signup'; import NotFound from './pages/notFound'; var routes = ( <Router history={createBrowserHistory()}> <Route path="/" component={Application}> <IndexRoute component={Index} /> <Route path="app" component={App} onEnter={ App.requireAuth } /> <Route path="auth" component={Auth} /> <Route path="signup" component={Signup} /> <Route path="login" component={Login} /> <Route path="*" component={NotFound} /> </Route> </Router> ); export default routes;
Thanks in advance for your help.
javascript reactjs react-router
almccann
source share