node.js - React-Router Webpack exclude server logic from bundling to client side javascript -
i making isomorphic react application, stuck of figuring out how exclude server-side logic bundling client side javascript using react-router , webpack.
so webpack has entry points "client.js" clientside bundle javascript.
import react "react"; import router "react-router"; import routes "../shared/routes"; router.run(routes, router.historylocation, (handler, state) => { react.render(<handler/>, document.getelementbyid('react-app')); });
"client.js" contains react-router routes definition.
and server side, have epxress , route set * (all requests route here)
"server.js"
import routes "../shared/routes"; app.get('/*', function (req, res) { router.run(routes, req.url, (handler, state) => { let html = react.rendertostring(<handler/>); res.render('index', { html: html }); }); });
since both client , server share same routes, if want set route in react-router e.g. /attractions/:id contain server side logic (database query, etc), bundled webpack client.js
so wondering if there way keep 1 routes.js shared both "client.js" , "server.js" , have "client.js" not bundle of server routes.
i came few possible solutions. see best way it.
- keep 2 routes, 1 server , 1 client, , server routes superset of client routes.
- add layer of abstraction react-router, instead of
<route handler="/attraction/:id"/>
i can use import abc "abcroutecontroller" , abcroutecontroller determine whether it's node or client , generate route or not generate route.
class appcontroller extends react.component { render () { let route; if #isserver route = <route handler={#somehandler}" path="/"> else route ="" return route; } }
- add specific routing server.js. instead of
app.get('/*', function (req, res) { router.run(routes, req.url, (handler, state) => { let html = react.rendertostring(); res.render('index', { html: html }); }); });
we add more specific routing handling pure server side logic (similar 2 seperate react-router server , client)
Comments
Post a Comment