How to require entire dir for Webpack or Browserify

Question

I'm learning how to use Webpack and Browserify so I'm still new at this. It seems to me that there should be an easy way to require entire dirs similar to ./dir/**/*.js but that doesn't seem possible. So if I understand correctly, I only have the following options:

• Put all my require() statements in my entry file (app.js).
• Create an index.js file in each of the directories that I want to require and add require statements in that file.
• Use the require-dir package (having npm problems with this one).

Am I missing something?

Answer 1

You could use require.context.

The following code creates a context with any files matching .js$ regular expression within ./dir directory recursively:

var req = require.context('./dir', true, /\.js$/);

All files within a context are bundled in webpack output. For example, the file ./dir/foo/bar.js can be loaded like this:

var bar = req('./foo/bar.js');

You can also retrieve a list of files in a context:

req.keys();