为什么导入/导出语句不起作用？答案

【问题标题】：Why is import/export statement not working?为什么导入/导出语句不起作用？
【发布时间】：2021-11-03 17:47:42
【问题描述】：

所以我有这两个文件：

foo1

const a = 2;
export {a};

和

foo2

import a from "./foo1.js";
console.log(a);

这两个文件都被做成了带有 html 的模块文件：

    <script src='./scripts/foo2.js' type='module'></script>
    <script src='./scripts/foo1.js' type='module'></script>

脚本一运行就会抛出这个错误：

Uncaught SyntaxError: The requested module './foo2.js' does not provide an export named 'default'

【问题讨论】：

【解决方案1】：

您的导入方式仅适用于默认导出/导入。所以有两种方法可以修复你的代码：

import a from "./foo1.js";

（不使用默认导出）

export default a;

然后在导入时你可以做任何事情，因为默认导出仍然是a：

import a from "./foo1.js"; import aWithNewName from "./foo1.js";

【讨论】：

第二种解决方案有效，但您能否详细说明“您导入的方式仅适用于默认导出/导入”的意思？
另外，在第二种解决方案中，我遇到了一个问题，如果我创建一个不同的变量并导出它，它只会导出默认值。
你在做import a from ...。这里a 将是默认导入，只是因为没有大括号。现在因为 没有默认导出。因此问题
在第二种情况下，如果你想导入多个变量，你将不得不做import aDefault , { bNotDefault, cNotDefault }。请注意默认变量如何可以没有大括号，其余的都必须在里面。检查：stackoverflow.com/questions/57723020/…
第一个解决方案也有效，谢谢，我不知道花括号有什么不同。

【解决方案2】：

如果您从foo1导出，则无需添加两个js文件，您只需要您要导入的文件。试试这个方法：

// foo1.js
export const a = 2;

// foo2.js
import { a } from "./foo1.js";
console.log(a);

 <script src='./scripts/foo2.js' type='module'></script>

【讨论】：