为什么JS代码中导入JSON文件需要默认

Question

我有一个 JSON 数据，可以从这个API获取。但是，当我将此链接的内容复制到本地文件并将其另存为 JSON，然后在 JS 中导入时，如下所示：

import * as data from "./data.json" assert { type: "json" };

console.log(data)

我在控制台中获取一个模块，其中默认参数包含我的 JSON 对象。

但是当我这样做时：

import * as data from "./data.json" assert { type: "json" };

console.log(data.default)

然后只有我可以像平常一样查看我的 JSON 对象，即如果我这样做，输出会是什么：

import * as data from "./data.json" assert { type: "json" };

console.log(data)

为什么会出现这种情况？有没有更好的方法来导入 JSON 文件，以便我可以在代码中访问它？

Answer 1

发生这种情况是因为该import * as行导入 an_entire_modules_contents，导致缺少显式默认export default 属性与 json 文件的内容一致。如果您希望变量包含您的 json 文件，您可以使用：data

import {default as data} from "./data.json";
console.log(data); //<-- it will print the content of your json file

或者下面的简单简写：

import data from "./data.json";