当 `typeorm/browser/index.js` 抛出 "Module parse failed: 'import' and 'export' may appear only with 'sourceType: module' error" 时会发生什么？

Question

我最近在 Node.js 上想出了一个新的纯 JS 网络应用程序运行（没有导入任何关于 TypeScript 的东西），使用 Next.js@12.0.10 作为框架和 TypeORM @0.2.41 作为 Azure SQL 服务器的 ORM 层。

一切正常，我已成功连接到 SQL 服务器。

然而，我不小心删除了package.json而没有提交。不管怎样，我设法重新安装了丢失的软件包，typeorm、reflect-metadata 和 mssql。但是重新安装后，当我启动开发服务器时，我遇到了一个以前从未见过的新错误。

error - ./node_modules/typeorm/browser/index.js
Module parse failed: 'import' and 'export' may appear only with 'sourceType: module' (3:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| /*!
|  */
> import "reflect-metadata";
| // -------------------------------------------------------------------------
| // Commonly Used exports

查了一下，可能是和webpack有关的东西。但我对此没有太多线索。下面是我的 next.config.js btw.

module.exports = {
  reactStrictMode: true,
  webpack: (config, options) => {
    config.module.rules.push({
      test: /\.html$/i,
      loader: "html-loader",
    });

    return config;
  },
};

我尝试了一些基本的健全性检查，例如删除 node_modules/ 并重新安装，但没有成功。有没有人知道发生了什么以及如何解决它？

更新：

在@hej 和 GitHub 上的 this issue 的帮助下，我将这部分添加到我的 next.config.js 并且它有效！

    config.module.rules.push({
      test: /\.[jt]sx?$/,
      include: [/node_modules(.*[/\])+typeorm/],
      type: "javascript/auto",
      use: "babel-loader",
    });

Answer 1

尝试将此添加到您的 webpack 配置中：

{
  module: {
    rules: [
      {
        test: /\.[jt]sx?$/,
        include: [/node_modules(.*[/\])+typeorm/],
        use: "babel-loader",
      },
    ],
  },
}

当 `typeorm/browser/index.js` 抛出 "Module parse failed: 'import' and 'export' may appear only with 'sourceType: module' error" 时会发生什么？

What happens when `typeorm/browser/index.js` throws "Module parse failed: 'import' and 'export' may appear only with 'sourceType: module' error"?

webpack

next.js

node-modules

typeorm

reflect-metadata