类没有被 babel 编译（nextjs / webpack）答案

【问题标题】：class doesn't get compiled by babel (nextjs / webpack)类没有被 babel 编译（nextjs / webpack）
【发布时间】：2019-10-18 23:53:11
【问题描述】：

问题：

我的网站使用下一个 js。在 2 页上，由于class i{constructor(e)...，我在 IE 中得到了script1002: syntax error。

我尝试了什么：

实现像in this example这样的polyfill
出现错误的页面都使用了 axios，但是当我切换到 fetch 时错误仍然存在
将此添加到.babelrc：

{
  "presets": [
    [
      "next/babel",
      {
        "preset-env": {
          "targets": {
            "browsers": ["> 1%", "last 2 versions", "IE >= 11"]
          },
          "useBuiltIns": "entry"
        }
      }
    ]
  ],
  "plugins": [
    "lodash",
    "@babel/plugin-proposal-class-properties",
    "@babel/plugin-transform-classes"
  ]
}

我不知道从这里去哪里...我不知道 100% 如果我的 polyfill 正在工作，但据我所知，babel 应该默认转译类。我也无法在我的代码中找到 class 的来源，并且不确定如何找到它所属的包。

【问题讨论】：

是不是因为它没有编译你在node_modules 中的东西？我最近在我的代码中遇到了这个问题——默认情况下，许多设置不会编译从 node_modules 导入的代码

标签： javascript reactjs webpack babeljs next.js

【解决方案1】：

添加

 config.module.rules.push({
      test: /\.js$/,
      include: /node_modules/,
      use: {
        loader: 'babel-loader',
        options: {
          presets: ['@babel/preset-env'],
          plugins: ['@babel/plugin-syntax-dynamic-import']
        }
      }
    });

进入我的next.config.js，通过强制它也转换所有node_modules来修复它

【讨论】：