如何使用webpack加载目录中的所有文件而不使用require语句 [英] How to load all files in a directory using webpack without require statements

查看:639
本文介绍了如何使用webpack加载目录中的所有文件而不使用require语句的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I have a large amount of javascript files split into 4 subdirectory in my app. In grunt I grab all of them and compile them into one file. These files do not have a module.exports function.

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

I want to use webpack and split it into 4 parts. I don't want to manually go in and require all my files.

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

I would like to create a plugin that on compilation walks the directory trees, then grabs all the .js file names and paths, then requires all files in the sub directories and adds it to the output.

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

I want all the files in each directories compiled into a module that I could then require from my entry point file, or include in the assets that http://webpack.github.io/docs/plugins.html mentions.

添加新文件时,我只想将其放在正确的目录中并知道它将被包含在内。

When adding a new file I just want to drop it in the correct directory and know it will be included.

有没有办法可以做这个用webpack或者有人编写的插件来做这个吗?

Is there a way to do this with webpack or a plugin that someone has written to do this?

推荐答案

这就是我为实现这个目的所做的:

This is what I did to achieve this:

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

这篇关于如何使用webpack加载目录中的所有文件而不使用require语句的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆