nodejs가 ECMAScript 모듈에서 json 파일을 로드하는 방법에 대한 간략한 분석

ECMAScript 모듈의 node에서 json 파일을 로드하는 방법》다음 글에서는 nodejs가 ECMAScript 모듈에서 json 파일을 로드하는 방법을 소개하겠습니다. 도움이 되길 바랍니다!

이 기사를 읽고 나면 다음 내용을 배울 수 있습니다.

1. nodejs json 파일을 로드하고 구문 분석하는 방법

2 fs 모듈이 json 파일을 읽는 방법

3.

3. 새로운 URL() 알아보기

4. load-json-file 라이브러리 알아보기

우리 모두 알고 있듯이 CommonJS 모듈 >File에 json을 로드하면 , require() 함수를 통해 직접 로드하면 json 객체를 얻을 수 있습니다. CommonJS模块中加载json文件，只需通过require()函数直接加载即可，即能得到json对象。

但是在ECMAScript模块中直接加载json文件，会报错，报错如下：

首先，先启用ESM模式，其实官方文档（http://nodejs.cn/api/esm.html#introduction）中也有说明：

Node.js 默认将 JavaScript 代码视为 CommonJS 模块。 作者可以通过 .mjs 文件扩展名、package.json "type" 字段、或 --input-type 标志告诉 Node.js 将 JavaScript 代码视为 ECMAScript 模块

那怎么才能在ECMAScript模块加载json文件呢？其实是有两种方案的：

假设现在有一个json文件：test.json

文件内容如下：

{
    "name": "project"
}

接下来，在index.js中引入test.json:

一、 通过 fs 文件系统读取 json 文件

import { readFile } from "fs/promises"; // 以promise的方式引入 readFile API

const json = JSON.parse(
    await readFile(new URL('./test.json', import.meta.url))
)

console.log('[json1]:', json); // 输出： { "name": "project" }

解释：

await: 根据 ECMAScript 顶层 await 提案，await 关键字可用于模块内的顶层（异步函数之外）;

import.meta.url：nodejs中返回模块在本地的file://协议的绝对路径，例如：file://home/user/main.js, 如果模块中还有另外一个文件test.js,那么test.js的路径就是new URL('test.js', import.meta.url)；

new URL： 生成file: 协议的对象（对于大多数 fs 模块函数，path 或 filename 参数可以作为使用 file: 协议的对象传入）。

二、 通过nodejs内置module模块的createRequire方法实现

import { createRequire } from "module";

const require = createRequire(import.meta.url);
const json = require('./test.json');

console.log('[json2]:', json); // 输出： { "name": "project" }

这种方法是根据nodejs提供的createRequire方法实现。

三、 24行源码的第三方库 load-json-file

그러나 ECMAScript 모듈에서 json 파일을 직접 로드하면 다음과 같은 오류가 보고됩니다.

먼저 ESM 모드를 활성화하세요. 실제로, 공식 문서(http://nodejs.cn /api/esm.html#introduction):

Node.js

는 기본적으로 JavaScript 코드를 CommonJS 모듈로 처리합니다. 작성자는 .mjs 파일 확장자, package.json "type" 필드 또는 --input-type</code를 전달할 수 있습니다. > 플래그는 Node.js에게 JavaScript 코드를 ECMAScript 모듈로 처리하라고 지시합니다. <a href="https://www.php.cn/course/list/24.html" target="_blank"></a></p>그렇다면 <code>ECMAScript 모듈에서 json 파일을 어떻게 로드할 수 있나요? 실제로 두 가지 해결책이 있습니다. 🎜🎜지금 json 파일이 있다고 가정합니다: test.json🎜🎜파일 내용은 다음과 같습니다: 🎜

import {readFileSync, promises as fs} from 'node:fs';

const {readFile} = fs;

const parse = (buffer, {beforeParse, reviver} = {}) => {

	// Unlike `buffer.toString()` and `fs.readFile(path, 'utf8')`, `TextDecoder`` will remove BOM.
        // 这里对buffer进行转义，没有用`buffer.toString()`和`fs.readFile(path, 'utf8')`，是因为`new TextDecoder().decode(buffer)`这种方式可以删除字节顺序标记（BOM）
        
        // 解码 buffer 并返回字符串
	let data = new TextDecoder().decode(buffer);
        
        // 在parse解析之前对字符串进行处理
	if (typeof beforeParse === 'function') {
		data = beforeParse(data);
	}

	return JSON.parse(data, reviver);
};

// 导出异步方法
export async function loadJsonFile(filePath, options) {
        // 如果未指定编码，则返回原始缓冲区。
	const buffer = await readFile(filePath);
	return parse(buffer, options);
}

// 导出同步方法
export function loadJsonFileSync(filePath, options) {
        // 如果未指定编码，则返回原始缓冲区。
	const buffer = readFileSync(filePath);
	return parse(buffer, options);
}

🎜Next, in index. js test.json 소개:🎜

1. fsjson 파일을 읽습니다. /code> 파일 시스템 🎜rrreee🎜설명: 🎜🎜await: ECMAScript 최상위 await 제안 🎜, await 키워드는 모듈 내의 최상위 수준(비동기 함수 외부)에서 사용할 수 있습니다. 🎜🎜import .meta.url: nodejs는 로컬 file:// 프로토콜에서 모듈의 절대 경로를 반환합니다(예: file://). home/user/main.js, 모듈에 다른 파일 test.js가 있는 경우 test.js의 경로는 new입니다. URL('test.js', import.meta.url) ; 🎜🎜새 URL: file: 프로토콜의 객체를 생성합니다(대부분의 fs 모듈 함수, path 또는 <code>filename 매개변수는 file: 프로토콜을 사용하여 객체로 전달될 수 있습니다. 🎜

2. nodejsmodule 모듈의 createRequire 메소드를 통해 🎜rrreee🎜를 구현합니다. /code> 해당 메소드는 nodejs에서 제공하는 createRequire 메소드를 기반으로 구현됩니다. 🎜🎜🎜

3. 24줄 소스 코드 타사 라이브러리 load-json-file🎜🎜🎜load-json-file🎜이 우연히 발견되었습니다. npm 웹사이트의 소스 코드는 다음과 같이 24줄뿐입니다. 🎜rrreee🎜🎜load-json-file 소스 코드🎜 전반적으로 비교적 간단하지만 깊이 있게 배울 수 있는 지식 포인트도 많습니다. 🎜🎜노드 관련 지식을 더 보려면 🎜nodejs 튜토리얼🎜을 방문하세요! ! 🎜

위 내용은 nodejs가 ECMAScript 모듈에서 json 파일을 로드하는 방법에 대한 간략한 분석의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!