Webpack: Ignore client libraries server-side

Question

I'm trying to use webpack to bundle react code that gets rendered server-side and client-side. Some libs I'm trying to use (like glidejs) completely assume they are executing in the browser.

I'm not actually using the lib until componentDidMount or at some other point which won't execute on the server.

How can I require them but basically just have them do nothing in the node environment?

Glidejs specifically wants jquery, window, and document. Giving it jquery seems fine but I don't know what to do about window and document.

Answer 1

I haven't found a beautiful solution for this problem too, but – at least – there are two possible solutions:

1. You could bundle your node.js code with webpack by specifying node as target. Then you can alias client-side code with empty stubs.

2. You can require() empty stubs and alias them in your webpack config to the real modules.