如何将babel运行时‘移动’到一个webpack供应商的动态链接库？

Question

我正在创建两个webpack包：vendors.dll.js和client.js。

供应商是用webpack.DllPlugin创建的。它包括node_modules/中的所有前端模块。这工作得很好。

客户端包含我的应用程序代码。它使用webpack.DllReferencePlugin来委托给供应商的DLL。这工作得很好。

客户端通过babel-loader运行所有的javascript。我使用的是babel-plugin-transform-runtime插件，它会导致一大堆核心-js内容被编译到我的客户端包中。我更喜欢将这些东西移动到DLL中，因为它不会像应用程序那样频繁地更改。

你不能只在DLL中包含babel-runtime (我已经尝试过了)。据我所知，core-js的加载更加直接，而babel- can甚至没有我所能说的main。

巴别塔: 6.x Webpack: 1.x

乐于提供实际的配置，如果它需要解决问题。

Answer 1

您可以扫描所需的目录并包含所有文件，如下所示。

const readDir = dir => {
  const result = [];
  fs.readdirSync(dir).map(file => {
    if (file.match(/\.js$/)) result.push(`${dir.replace('./node_modules/', '')}/${file}`);
    else if (fs.lstatSync(dir + '/' + file).isDirectory()) result.push(...readDir(dir + '/' + file));
  });
  return result
}
const babelRuntimeHelpers = readDir('./node_modules/babel-runtime/helpers');
const babelRuntimeCoreJs = readDir('./node_modules/babel-runtime/core-js');

然后将它们添加到您的供应商数组中：

vendor: [
    ...babelRuntimeHelpers,
    ...babelRuntimeCoreJs,
    ...rest
]