Verwenden Sie Webpack, um alle Dateien in einem Verzeichnis zu laden, ohne dass eine Require-Anweisung erforderlich ist

Question

Ich habe eine große Anzahl von Javascript-Dateien, die über 4 Unterverzeichnisse meiner Anwendung verteilt sind. Grunzend sammle ich sie alle und kompiliere sie in einer Datei. Für diese Dateien gibt es keine module.exports-Funktion.

Ich möchte sie mithilfe von Webpack in 4 Teile aufteilen. Ich möchte nicht alle Dateien manuell referenzieren.

Ich möchte ein Plugin erstellen, das zur Kompilierungszeit den Verzeichnisbaum durchsucht und alle .js-Dateinamen und -Pfade abruft, dann alle Dateien in den Unterverzeichnissen referenziert und sie der Ausgabe hinzufügt.

Ich möchte, dass alle Dateien in jedem Verzeichnis in einem Modul kompiliert werden, auf das dann in meiner Eintragsdatei verwiesen oder wie in http://webpack.github.io/docs/plugins.html erwähnt in Ressourcen eingebunden werden kann.

Wenn ich eine neue Datei hinzufüge, möchte ich sie einfach im richtigen Verzeichnis ablegen und wissen, dass sie eingebunden wird.

Gibt es eine Möglichkeit, dies mithilfe eines Webpacks oder eines von jemand anderem geschriebenen Plugins zu erreichen?

Answer 1

在我的应用文件中，我最终放置了require

require.context(
  "./common", // 上下文文件夹
  true, // 包括子目录
  /.*/ // 正则表达式
)("./" + expr + "")

感谢这篇帖子：https://github.com/webpack/webpack/issues/118

现在它正在添加所有我的文件。我有一个用于html和css的加载器，看起来工作得很好。

Answer 2

这是我为了实现这个目标所做的：

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