How does the isomorphic / universal webpack plugin work?

Question

I found 2 tools to solve the problem with server side module loaders: webpack-isomorphic tools and universal-webpack . Can someone please explain to me the important steps how this works? How does it capture / retrieve imported / required modules ?

Answer 1

I am the author of these three modules.

webpack-isomorphic-toolsintercepts the Node.js function require()with help require-hackerand intercepts require()calls for all assets with a customized one extension, returning their compiled Webpack form (taken from the one webpack-assets.jsoncreated webpack-isomorphic-tools/pluginduring the Webpack build).

universal-webpackdoesn’t connect to the function require()- it’s just a helper for converting the Webpack configuration on the client side to the Webpack configuration on the server side. It does not work on the server side or something like that. It's just a Webpack configuration generator - it turned out that Webpack has a parameter target: "node"that makes it output code that runs on Node.js, without any problems.

webpack-isomorphic-tools universal-webpack, universal-webpack . webpack-isomorphic-tools ( ) .