Webpack dynamic request

Question

It's not working

let serviceName = "AuthService";
let servicePath = `app/services/${serviceName}`; 
let service     = require(servicePath);

It's working

let service = require("app/services/AuthService");

How can I use webpack dynamic modules?

Error:

Cannot find module 'app/services/AuthService'.

I written log message at the end of file and it was shown before module error.

As I found in doc just need use a simple require. (https://webpack.github.io/docs/context.html#dynamic-requires)

I don't think that I need create my own context for this work.

Answer 1

There are two options to make this:

1) You need to provide specific expressions:

let serviceName = "AuthService";
let service  = require('./app/services/' + serviceName);

webpack parses the require statement and extracts some information(directory, regular expression) for building context.

2) You can create your own context with the require.context function:

let serviceName = "AuthService";
let context = require.context('./app/services', false);
let service = context('./' + serviceName);

See more https://webpack.github.io/docs/context.html