JSON模块,JS JSON
本文带你了解ECMAScript: JSON模块的新提议。让我们看看JSON模块是如何工作的。希望对你有帮助！
ECMAScript模块系统(导入导出关键字)默认只能导入JavaScript代码。
但是，将应用程序的配置保存在JSON文件中通常很方便，因此我们可能希望将JSON文件直接导入ES模块。
长期以来，commonjs模块格式支持导入JSON。
好消息是，第三阶段一个名为JSON module的新提案提出了将JSON导入es模块的方法。现在，让我们看看JSON模块是如何工作的。
1.导入 config.json
假设我们有一个config.json文件，内容如下：
{
名称:我的应用，
版本: 1.2版
}如何将config.json导入ES模块？
例如，我们创建一个简单的Web应用程序，显示JSON配置文件中应用程序的名称和版本。
如果尝试直接导入config.json，Node.js会抛出错误。
从“http”导入http；
从导入配置。/config . JSON ；
超文本传送协议（Hyper Text Transport Protocol的缩写）。createServer((req，res)={
RES . write(` app name:$ { config . name } \ n `)；
RES . write(` app version:$ { config . version } `)；
RES . end()；
})。听(8080)；尝试运行应用程序时，node.js引发了错误类型error[err _ unknown _ file _ extension]:未知文件扩展名。json
当Node.js使用import语句时，默认情况下它需要JavaScript代码。但得益于JSON模块的提出，你可以指明你要导入的数据类型：JSON。
在修复应用程序之前，我们先来看看JSON模块提案。
2. JSON 模块提案
JSON模块提案的实质是允许使用常规的import语句将JSON数据导入ES模块。
您可以通过添加导入断言来导入JSON内容：
从导入jsonObject。/file . JSON assert { type: JSON }；Assert {type: json}是一个导入断言，指示模块应该作为json进行解析和导入。
JSON变量包含解析file.json内容后创建的普通JavaScript jsonObject
默认情况下，JSON模块的内容是导入的，命名导入不可用。
JSON模块也可以动态导入：
const { default:JSON object }=await import(。/file.json ，{
断言：{
类型：“json”
}
});当动态导入一个模块(包括一个JSON模块)时，默认内容在default属性中可用。
在这种情况下，导入断言表示JSON类型。然而，有一个更通用的建议是导入断言(目前在第3阶段),它允许导入更多的数据格式，比如CSS模块。
3. 启用JSON模块
现在，我们将JSON模块集成到Web应用程序中：
从“http”导入http；
从导入配置。/config . JSON assert { type: JSON }；
超文本传送协议（Hyper Text Transport Protocol的缩写）。createServer((req，res)={
RES . write(` app name:$ { config . name } \ n `)；
RES . write(` app version:$ { config . version } `)；
RES . end()；
})。听(8080)；主模块现在导入config.json文件并访问其值config.name和config.version
JSON模块在Node.js版本=17.1中工作。您还可以使用-experimental-json-modules标志来启用- experimental-json-modules。
node-experimental-JSON-modules index . mjs在浏览器环境中，Chrome 91提供JSON模块。
4.总结
默认情况下，ES模块只能导入JavaScript代码。
得益于JSON模块的提出，可以直接将JSON内容导入ES模块。导入语句后使用导入断言即可。
从导入jsonContent。/file . JSON assert { type: JSON }；可以使用Node.js 17.1的JSON模块，使用实验logo-experimental-JSON-modules-modules，在Chrome 91及以上使用。
有关编程的更多信息，请访问：编程视频！那就是说JavaScript中JSON模块的细节了。更多请关注我们的其他相关文章！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。