如何在不需要语句的情况下使用webpack加载子目录中的所有文件

我的应用程序中有大量的javascript文件分成4个子目录。 在咕I中，我抓住了所有这些，并将它们编译成一个文件。 这些文件没有module.exports函数

我想使用webpack并将其分为4个部分。 我不想手动进去，并要求我所有的文件。

我想创build一个在编译时遍历目录树的插件，然后抓取所有的.js文件名和path，然后需要子目录中的所有文件并将其添加到输出中。

我希望将每个目录中的所有文件编译成一个模块，然后我可以从我的入口点文件中获取所需的模块，或者将其包含在http://webpack.github.io/docs/plugins.html提及的资源中。

当添加一个新的文件，我只想把它放在正确的目录，并知道它将被包括在内。

有没有办法做到这一点与webpack或有人写了这样做的插件？

Answer 1

这是我做到这一点：

function requireAll(r) { r.keys().forEach(r); } requireAll(require.context('./modules/', true, /\.js$/)); 

Answer 2

在我的应用程序文件中，我结束了要求

 require.context( "./common", // context folder true, // include subdirectories /.*/ // RegExp )("./" + expr + "") 

礼貌这个职位： https ： //github.com/webpack/webpack/issues/118

现在正在添加我所有的文件。 我有一个加载器的HTML和CSS，它似乎很好。

Answer 3

如何在一个文件夹中的所有文件的地图？

 // { // './image1.png': 'data:image/png;base64,iVBORw0KGgoAAAANS', // './image2.png': 'data:image/png;base64,iVBP7aCASUUASf892', // } 

做这个：

 const allFiles = (ctx => { let keys = ctx.keys(); let values = keys.map(ctx); return keys.reduce((o, k, i) => { o[k] = values[i]; return o; }, {}); })(require.context('./path/to/folder', true, /.*/)); 

Answer 4

这对我有用：

 function requireAll(r) { r.keys().forEach(r); } requireAll(require.context('./js/', true, /\.js$/)); 

注意：这可以在./js/的子目录中recursion地需要.js文件。