I'm using meteor with webpack, react and react-router.
I have an webpack entry point (specific to meteor):
"browser": "client/main.jsx"
In the main.jsx, I import my router (again meteor's logic):
import { renderRoutes } from '../imports/startup/client/routes.jsx';
Meteor.startup(() => {
render(renderRoutes(), document.getElementById('app'));
});
In the routes.jsx, I import all the components:
...
import Landing from '../../../imports/ui/pages/landing-content/landing/Landing.jsx';
import Signin from '../../../imports/ui/pages/landing-content/signin/Signin.jsx';
import Signout from '../../../imports/ui/pages/landing-content/signout/Signout.jsx';
...
export const renderRoutes = () => (
<Router history={browserHistory}>
<Route path="/" component={LandingContainer} onEnter={ requireNotAuth }>
<IndexRoute component={Landing}/>
<Route path="signin" component={Signin}/>
<Route path="signout" component={Signout}/>
<Route path="*" component={Landing}/>
</Route>
</Router>
);
My problem is that webpack, using the react-router, imports all the components, and so, all the components styles. It is not importing the specific style for each route (signout style in /signout
and signin style in /signin
).
How can I solve that ?
NB: I think that my problem is not specific to meteor.
Thanks.