如何编写Webpack插件以按需生成index.js文件？

Question

总的来说，我想知道如何根据需要在Webpack插件中进行代码生成/制作。我希望为“必需”时不存在的文件生成内容。

具体来说，我想要一个插件，当我需要一个目录时，它会自动地要求该目录中的所有文件(递归)。

例如，假设我们有目录结构：

• foo
  • bar.js
  • baz.js

​

• main.js

main.js有：

var foo = require("./foo");
// ...

我希望webpack自动生成foo/index.js：

module.exports = {
  bar: require("./bar"),
  baz: require("./baz")
};

我读过大多数webpack的博士论文。github.com/webpack/docs/wiki/How-to-write-a-plugin有一个生成资产的例子。然而，我找不到一个如何按需生成资产的例子。看起来这应该是一个Resolver，但是解析器似乎只输出文件路径，而不是文件内容。

Answer 1

实际上，对于您的用例：

具体来说，我想要一个插件，当我需要一个目录时，它会自动地要求该目录中的所有文件(递归)。

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

按需进行代码生成/制作可以很容易地在JavaScript中完成，为什么要将您的代码生成限制在仅适用于WebPack“需要”的情况下？

由于NodeJS本身将查找一个index.js，如果您需要一个目录，您可以很容易地生成任意导出：

//index.js generating dynamic exports
var time = new Date();

var dynamicExport = {
  staticFn : function() {
    console.log('Time is:', time);
  }
}

//dynamically create a function as a property in dynamicExport
//here you could add some file processing logic that is requiring stuff on demand and export it accordingly
dynamicExport['dyn' + time.getDay()] = function() {
  console.log('Take this Java!');
}

module.exports = dynamicExport;