只对所需的Node_modules进行内嵌的babel转置。

Question

我对nextjs进行了如下配置，以处理IE11的ES6代码。

 module.exports = {
  poweredByHeader: false,
  distDir: "ssr_build",
  webpack(config) {
    config.node = { fs: "empty", net: "empty", tls: "empty" }
    config.plugins = config.plugins || []
    config.module.rules.push({
      test: /\.js$/,
      include: /node_modules/,
      use: {
        loader: "babel-loader",
        options: {
          presets: [
            [
              "next/babel",
              {
                targets: { ie: 11 },
              },
            ],
          ],
        },
      },
    })
    return config
  },
}

我想知道是否可以有一个条件，只有在ES6的情况下才可以移植node_modules模块，而不需要花时间去移植**所有的东西。. 帮助！**

更新1.0。

我已经找到了需要ES6转换的ES5依赖关系，使用。https:/github.comobaharethare-you-es5。，创建了一个排除的regex，没有成功。我将再试一次，看看是否缺少子-子依赖关系。

我已经尝试了 - https:/github.commartpienext-transpile-modules。不幸的是，它需要手动插入所有的node_modules。这似乎是一个繁琐的过程，于是停止了这个做法。

Answer 1

我看到你有两个选择。

选项1（更好的） - 调查你的依赖关系。大多数的依赖关系在构建阶段就会转移到ES5，然后你就可以了。您可以检查它们的 dist 文件夹(通常)，或者只是看看文档或问题。

如果你发现有一些依赖关系被移植到ES6，你可以使用这个next.js插件，有选择地只移植那些。https:/github.commartpienext-transpile-modules。

备选方案2 - 如果您不知道哪些node_modules实际上包含ES6代码，而且您不想花时间去了解您的项目依赖关系。

配置 @babelpreset-env 的配置文件，并且仍然扫描所有的节点模块。这个加载器应该根据你的目标环境，只移植需要移植的代码部分。

{
  "targets": {
    "ie": "11"
  }
}