转译顶级 node_modules 依赖的 ES6 嵌套 node_modules 依赖

Question

我的 node_modules 有一个 ES6 格式的依赖项，它的嵌套 node_modules 依赖项也是 ES6 格式。

我管理了如何将顶级依赖项例如 dependencyA 包含到 babel 配置中，并将其转换为项目代码。但是如果这个依赖还有其他ES6格式的依赖怎么办呢？ 那么：如何配置 babel/webpack 来转译嵌套的 node_modules 依赖？

这是结构

Project (Babel/Webpack/Typescript)
 - node_modules
   - dependencyA (ES6) // ok, added top level ES6 dep to babel transpilation
     - node_modules
       - nested_dependency (ES6) // what to do with that?

我是否应该更深入地手动包含这样一个嵌套的 node_modules 包？

例如。 babel.config.js

const path = require('path');
module.exports = function (api) {
  api.cache(true);
  return {
    sourceMaps: true,

    include: [
      path.resolve('src'),
      path.resolve('node_modules/dependencyA'), // ok, added top level ES6 dep

      path.resolve('node_modules/dependencyA/node_modules/nested_dependency'), // should I do that?
    ],
    presets: [
      '@babel/preset-env',
      '@babel/preset-react',
      '@babel/preset-flow',
      '@babel/preset-typescript',
    ],
  .....

看起来有点多余。有没有办法处理它？ 感谢您的帮助！

Answer 1

有一种很酷的方法可以使用正则表达式否定查看头部。

语法为：X(?!Y)，意思是“搜索X，但只有在后面没有Y”。

假设您知道要转译哪些 node_modules 依赖（在第一级）。

您可以指定此正则表达式/(dep1|dep2)[\\/](?!.*node_modules)/。

const PATH_DELIMITER = '[\\\\/]'; // match 2 antislashes or one slash
const safePath = (module) => module.split('/').join(PATH_DELIMITER);

const generateIncludes = (modules) => {
  return [
    new RegExp(`(${modules.map(safePath).join('|')})$`),
    new RegExp(`(${modules.map(safePath).join('|')})${PATH_DELIMITER}(?!.*node_modules)`)
  ];
};

const generateExcludes = (modules) => {
  return [
    new RegExp(
      `node_modules${PATH_DELIMITER}(?!(${modules.map(safePath).join('|')})(${PATH_DELIMITER}|$)(?!.*node_modules))`
    )
  ];
};

此代码取自next-transpile-modules。

这两个函数应该用你需要转译的模块数组调用，并将其传递给include & exclude