无法从非 EcmaScript 模块导入命名导出“指令”（仅默认导出可用）

Question

这是我正在研究的离子角度项目，我正在使用 ng-lazyload-image 插件 链接。当我开始编译时显示这样的错误。

 Error: ./node_modules/ng-lazyload-image/fesm2015/ng-lazyload-image.mjs 401:10-19

Can't import the named export 'Directive' from non EcmaScript module (only default export is available)

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

Answer 1

这意味着您的捆绑器解析 .mjs 文件，但它不知道它们是 ESM 模块。在 webpack 上，您可以将以下内容添加到规则中。

webpack.config.js（在项目根目录中）

 module.exports = {
  configureWebpack: {
    module: {
      rules: [
        {
          test: /\.mjs$/,
          include: /node_modules/,
          type: "javascript/auto"
        }
      ]
    }
  }
}

https://webpack.js.org/configuration/

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