Dealing with Webpack outside of the browser

Question

I love a lot about Webpack and there's no shortage of blog posts singing its praises so I'll just reiterate that what it does is incredible for generating a client side js bundle along with ancillary files like css, images, markdown, etc. Now on to the problems…

Using require for non-js files has been a major hassle to get around outside of the browser-bundle context. I'll just talk about two big ones I've faced.

1. Rendering react components server-side that require non-js files.
2. Running integration tests on express middleware that require files that in-turn require other non-js files. The middleware itself is fine.

I've gotten around the first issue using Webpack Isomorphic Tools which seems like an ok workaround. I was doing a second server side Webpack bundle but I didn't like the dev-server/rebuild setup I had. I'm still not sure how best to handle the mocha issue. Tests I have that run in a browser are fine using Karma and karma-webpack. But I want my middleware test to run on Node.

Once I decided to require a non-js file I really tied my hands on how I can work with that file. I'm really curious what others are doing?

Answer 1

I tried crafting a setup with both server side and client side Webpack builds. https://github.com/halt-hammerzeit/webpack-react-redux-isomorphic-render-example Seems to work ok, still it may be not the best solution.