Is it possible to load in browser a module dynamically by name stored in a variable?

Question

I would like to be able to configure at the run time which modules to load in browser like that:

var moduleName  =  'my-module'
var module = require(moduleName)

It does't seem to work out of the box with but perhaps there is some way?

Related: http://stackoverflow.com/questions/37241662/using-require-with-a-variable-vs-using-a-string-in-webpack — Maria Ines Parnisari, Apr 29 '17 at 03:18
I checked the syntax of the import keyword, the path to the module must be string literal. Have you reach to an answer? — M.Abulsoud, Oct 24 '17 at 08:05

score 0 · Answer 1 · edited May 23 '17 at 12:02

Yes, There are many ways

Webpack Hot Module Replacement Feature

https://webpack.github.io/docs/hot-module-replacement.html

Example from Webpack Docs

var requestHandler = require("./handler.js");
var server = require("http").createServer();
server.on("request", requestHandler);
server.listen(8080);

// check if HMR is enabled
if(module.hot) {
    // accept update of dependency
    module.hot.accept("./handler.js", function() {
        // replace request handler of server
        server.removeListener("request", requestHandler);
        requestHandler = require("./handler.js");
        server.on("request", requestHandler);
    });
}

For methods check this answer

How do I include a JavaScript file in another JavaScript file?

Thank you, but will it only work with webpack running? Can I use it to compile production bundle that would load the module? — Dmitri Zaitsev, Apr 30 '17 at 02:08

Is it possible to load in browser a module dynamically by name stored in a variable?

1 Answers1