Import Assertions 与 JSON 模块：工程实践与兼容

--- title: "Import Assertions 与 JSON 模块：工程实践与兼容" keywords: - Import Assertions - JSON 模块 - ESM - 动态导入 - 兼容性 - 构建 description: "解释 Import Assertions 在浏览器与 Node 环境下加载 JSON 模块的语法与行为，说明动态导入与构建兼容策略，并提供工程注意与参考。" categories: - 文章资讯 - 编程技术 --- # 概述 Import Assertions 为 ESM 引入资源类型断言，允许直接导入 JSON 等非脚本资源。正确的语法与构建配置可减少手工解析与包装代码，提升工程一致性。 # 语法与用法 - 静态导入：`import data from './data.json' assert { type: 'json' }`。 - 动态导入：`const data = await import('./data.json', { assert: { type: 'json' } })`［参考1,2］。 - 在 Node/浏览器中的支持差异需按版本与平台确认。 # 工程注意 - 构建工具需支持 JSON 模块与断言（Vite/Rollup/Webpack 等）；对不支持的平台提供回退（如 `fetch` + `response.json()`）。 - 避免在热路径中频繁动态导入大 JSON；可按需分片或缓存。 # 参考与验证 - ［参考1］MDN 中文：Import Assertions 概览与语法示例：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Modules#import_assertions - ［参考2］MDN 英文：Import Assertions 说明与 JSON 模块示例：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules#import_assertions - ［参考3］web.dev：模块化与资源类型断言的工程案例与兼容说明：https://web.dev/articles/module-workers # 关键词校验 关键词与 Import Assertions/JSON 模块一致。