无法从非 EcmaScript 模块导入命名的导出 XXXX（只有默认导出可用）

Question

我有一个客户端-服务器设置，其中客户端（create-react-app）在 localhost:3000 上运行，服务器是一个构建在节点上的快速服务器，我正在尝试构建 graphql 模式解析器设置。

我可以在服务器上导入 .graphql 文件，但是，在客户端，我使用的是 graphql-tools 的这个设置。

当我尝试在前端构建模式解析器时，我正在导入

import { GraphQLFileLoader } from '@graphql-tools/graphql-file-loader';
import { addResolversToSchema } from '@graphql-tools/schema';
import { loadSchema } from '@graphql-tools/load';

…导致此错误：./node_modules/@graphql-tools/graphql-file-loader/index.mjs Can’t import the named export ‘AggregateError’ from non EcmaScript module (只有默认导出可用)

经过研究，我发现这是一个与 webpack 相关的问题。

这个问题有解决方案吗？

原文由 Elroy Toscano 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

解决方案是确保在项目目录的根目录中有一个 webpack.config.js 文件，如下所示：

 const config = {
  mode: 'production', // "production" | "development" | "none"
  resolve: {
    extensions: ['*', '.mjs', '.js', '.json']
  },
  module: {
    rules: [
      {
        test: /\.mjs$/,
        include: /node_modules/,
        type: 'javascript/auto'
      }
    ]
  }
}

module.exports = config

你也可以看看 https://github.com/vanruesc/postprocessing

原文由 Eduard 发布，翻译遵循 CC BY-SA 4.0 许可协议