Une brève analyse de la façon dont nodejs charge les fichiers json dans le module ECMAScript-js tutoriel-php.cn

Une brève analyse de la façon dont nodejs charge les fichiers json dans le module ECMAScript

青灯夜游

Libérer： 2021-12-07 18:49:04

avant

2485 Les gens l'ont consulté

Comment charger des fichiers json dans node dans le module ECMAScript》L'article suivant vous présentera comment nodejs charge les fichiers json dans le module ECMAScript. J'espère qu'il vous sera utile !

Une brève analyse de la façon dont nodejs charge les fichiers json dans le module ECMAScript

Après avoir lu cet article, vous apprendrez :

1. nodejs Comment charger et analyser les fichiers json

2. Comment le module fs lit les fichiers json

3.

3. Apprenez une nouvelle URL()

4. Apprenez la bibliothèque de fichiers Load-json

Comme nous le savons tous, si vous chargez jsondans le module CommonJS > Fichier. , chargez-le simplement directement via la fonction require(), et vous pourrez obtenir l'objet json. CommonJS模块中加载json文件，只需通过require()函数直接加载即可，即能得到json对象。

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

Une brève analyse de la façon dont nodejs charge les fichiers json dans le module ECMAScript

首先，先启用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"
}

Copier après la connexion

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

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

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

const json = JSON.parse(
    await readFile(new URL(&#39;./test.json&#39;, import.meta.url))
)

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

Copier après la connexion

解释：

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(&#39;./test.json&#39;);

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

Copier après la connexion

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

Une brève analyse de la façon dont nodejs charge les fichiers json dans le module ECMAScript

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

Mais si vous chargez directement le fichier json dans le module ECMAScript, une erreur sera signalée. L'erreur est la suivante :

Tout d'abord, activez le mode ESM. En fait, le document officiel (http://nodejs.cn /api/esm.html#introduction) :

Node.js

traite le code JavaScript comme un module CommonJS par défaut. Les auteurs peuvent transmettre l'extension de fichier .mjs, le champ package.json "type" ou --input-type</code > Flag indique à Node.js de traiter le code JavaScript comme un module ECMAScript <a href="https://www.php.cn/course/list/24.html" target="_blank"></a></p>Alors, comment puis-je charger un fichier <code>json dans le module ECMAScript ? En fait, il y a deux solutions : 🎜🎜Supposons qu'il y ait maintenant un fichier json : test.json🎜🎜Le contenu du fichier est le suivant : 🎜

import {readFileSync, promises as fs} from &#39;node:fs&#39;;

const {readFile} = fs;

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

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

Copier après la connexion

🎜Ensuite, dans index. js Introduisez test.json :🎜