无法将 babel“preset-env”插件与 NextJS 一起使用答案

【问题标题】：Not able to use babel "preset-env" plugin with NextJS无法将 babel“preset-env”插件与 NextJS 一起使用
【发布时间】：2021-02-08 00:25:00
【问题描述】：

我有一个要求，我尝试使用 Babel 插件“preset-env”。这个插件将我的 NextJS 项目从 ES6 编译到 ES5。我按照 NextJS 文档的建议创建了 .babelrlc 文件，并添加了这样的插件：

{
    "presets": ["next/babel"],
    "plugins": ["@babel/preset-env"]
}

当我尝试在本地运行我的项目时出现此错误：

error - ./node_modules/next/dist/client/router.js
Error: Cannot find module '@babel/plugin-preset-env' from '/Users/agastya/Local/testcap/Sample-proj'
- If you want to resolve "@babel/preset-env", use "module:@babel/preset-env"
- Did you accidentally pass a preset as a plugin?

NextJS 文档说“Next.js 将 next/babel 预设到您的应用程序中，其中包括编译 React 应用程序和服务器端代码所需的一切。”。

如果有人可以解释解决此问题的正确方法/方法是什么，那就太好了。

【问题讨论】：

标签： plugins babeljs next.js

【解决方案1】：

您必须执行以下操作：

// .babelrc file, also could be babel.config.js
{
  "presets": [
    [
      "next/babel",
      {
        "preset-env": {},
        "transform-runtime": {},
        "styled-jsx": {},
        "class-properties": {}
      }
    ]
  ],
  "plugins": []
}

取自：https://nextjs.org/docs/advanced-features/customizing-babel-config

【讨论】：