如何使用动态目录中的 webpack 要求 JavaScript

Question

我有一些老式的普通 ES5 JavaScript，我需要将它们拉入我使用 webpack 作为捆绑器的应用程序中。问题是这些文件的位置在一个路径是动态的文件夹中。似乎 webpack 不能很好地处理 require 中的表达式，而 require.context 根本不允许它们。

对于需要一个目录及其子目录中所有文件的已知路径目录，这种方法效果很好：

let domainRequires = require.context('./app/domain', true, /\.js$/); domainRequires.keys().forEach(domainRequires);

由于我不能在require.context 中使用表达式，我尝试只使用普通的require，它不起作用：

require('../../path/to/code/my-library-' + versionNumber + '/domain/clazz.js');

使用完整的相对路径。

我也尝试过使用require.context，但增强了正则表达式部分以使其正常工作并且没有运气：

require.context('../../path/to/code', true, /^my-library-.*\/domain\/.*\.js$/);

欢迎任何想法、建议或解决方案。如果我需要在 webpack 中使用 3rd 方，那也没关系。

Answer 1

我最终想通了。通过使用 webpack resolve.alias，我可以添加：

resolve: {
  alias: {
    common: path.resolve(__dirname, '../../path/to/code/my-library-' + versionNumber + '/domain')
  }
}

在webpack.config.

然后在我的代码中，我可以要求/domainvia 下的所有文件：

var commonRequires = require.context('common', true, /\.js$/);
commonRequires.keys().forEach(commonRequires);

同样，我可以通过以下方式获取单个文件：

require('common/clazz.js'); // ../../path/to/code/my-library-1.0.0/domain/clazz.js

FWIW，为了得到versionNumber，我使用node的fs模块从json文件中读取，使用JSON.parse(file)，然后在webpack.config顶部检索版本

Answer 2

从 Webpack 3.9（我认为）开始，不需要 commonRequires。我在 webpack.config.js 中运行它：

resolve: {
  alias: {
    tmpDir: path.resolve(__dirname, '/tmp')
  }
}

然后我将我的自定义模块加载为：

const dynModule = require('tmpDir/dyn_module.js');

不确定我是否遗漏了您的要求，但我不需要 commonRequires 并且 Webpack 可以很好地构建它（并且可以正常工作）。