如何在ECMAScript 6中访问JSON文件?

以下选项无效:

import config from '../config.json'

如果我试图导入一个JavaScript文件,这可以正常工作。


https://www.stefanjudis.com/snippets/how-to-import-json-files-in-es-modules-node-js/

ES模块在Node.js领域仍然相当新(它们从Node 14开始就很稳定)。模块带有内置的模块系统,以及顶级等待等特性。

我读了Pawel Grzybek写的一篇关于ES模块的文章,了解到现在不能在ES模块中导入JSON文件。

import info from `./package.json` assert { type: `json` };


const { default: info } = await import("./package.json", {
  assert: {
    type: "json",
  },
});

这真的很糟糕,因为我非常习惯在Node.js中执行诸如const data = require('./some-file.json')之类的require调用。

但是现在你能在Node.js中使用导入断言吗?

在撰写本文时,当前的Node.js LTS (v18.12)仍然将导入断言标记为实验性。

这篇文章解释了在ES模块中处理JSON的方法,如果你还不想使用实验特性的话。

选项1:自己读取和解析JSON文件

Node.js文档建议使用fs模块,自己完成读取文件和解析的工作。

import { readFile } from 'fs/promises';
const json = JSON.parse(
  await readFile(
    new URL('./some-file.json', import.meta.url)
  )
);

选项2:利用CommonJS的require函数来加载JSON文件

文档还说明了可以使用createRequire加载JSON文件。这种方法是Pawel在他的博客文章中建议的方法。

createRequire允许你构造一个CommonJS require函数来使用典型的CommonJS特性,比如在Node.js EcmaScript模块中读取JSON。

import { createRequire } from "module";
const require = createRequire(import.meta.url);
const data = require("./data.json");

当前回答

在ECMAScript 6中导入JSON文件

import myJson from './example.json' assert {type: 'json'};

其他回答

导入JSON文件仍处于实验阶段。它可以通过下面的标志来支持。

——experimental-json-modules

否则,你可以直接用fs加载相对于import.meta.url的JSON文件

import { readFile } from 'fs/promises';
const config = JSON.parse(await readFile(new URL('../config.json', import.meta.url)));

你也可以使用module.createRequire()

import { createRequire } from 'module';
const require = createRequire(import.meta.url);
const config = require('../config.json');

简单地这样做:

import * as importedConfig from '../config.json';

然后像下面这样使用它:

const config = importedConfig.default;

对于NodeJS v12及以上版本,——experimental-json-modules就可以了,不需要babel的任何帮助。

https://nodejs.org/docs/latest-v14.x/api/esm.html#esm_experimental_json_modules

但是它是以commonjs的形式导入的,所以还不支持从'c.json'导入{a, b}。

但是你可以:

import c from 'c.json';
const { a, b } = c;

我用它安装插件“babel-plugin-inline-json-import”,然后在.balberc中添加插件。

安装插件 NPM install——save-dev babel-plugin-inline-json-import babelrc中的配置插件 “插件”:( “inline-json-import” ]

这是我使用它的代码

import es from './es.json'
import en from './en.json'

export const dictionary = { es, en }

一个更优雅的解决方案是使用CommonJS的require函数

createRequire构造了一个CommonJS的require函数,这样你就可以使用典型的CommonJS特性,比如读取JSON

import { createRequire } from "module";
const require = createRequire(import.meta.url);
const data = require("./data.json");