为什么我在我的普通 JavaScript 项目中收到“Uncaught SyntaxError：不明确的间接导出”错误消息？

Question

我有一个普通的 JavaScript 项目。 我正在尝试从一个文件导出 2 个函数并将它们导入到另一个文件中。 但是，我收到以下错误消息：

Uncaught SyntaxError: ambiguous indirect export: anchor_b

以下是2个文件的内容：

文件1（anchors.js）

let anchor_a = () => "abcd1234";
let anchor_b = () => "xyz789";

export default { anchor_a, anchor_b };

文件2

import { anchor_a, anchor_b } from "./anchors.js";
console.log(anchor_a());
console.log(anchor_b());

为什么代码无法工作以及如何使其工作？

Answer 1

您不能将默认导出作为导入声明的一部分进行解构。

注意： import { x, y } from "mod" 不等于 import defaultExport from "mod" 然后从 defaultExport 解构 x 和 y。命名导入和默认导入是 JavaScript 模块中不同的语法。 来源

您可以做的是首先导入

anchors

，然后解构该对象，如下所示：

// anchors.js
let anchor_a = () => "abcd1234";
let anchor_b = () => "xyz789";

export default { anchor_a, anchor_b };

// File 2
import anchors from "anchors.js";
let { anchor_a, anchor_b } = anchors;

或者使用命名导入（首选解决方案）：

// anchors.js
export let anchor_a = () => "abcd1234";
export let anchor_b = () => "xyz789";

// File 2
import { anchor_a, anchor_b } from "anchors.js";