合法值仅为type="application/importmap"，大小写敏感且须置于head内、所有type="module"脚本之前；映射url需返回es模块并匹配content-type；旧浏览器需兼容兜底。
type="importmap"根本不是合法值，必须用type="application/importmap"
浏览器根本不认识 type="importmap" —— 它不是 MIME 类型，Chrome、Firefox、Safari 都会静默忽略，甚至报错 Failed to execute 'import' on 'WorkerGlobalScope': The script has unsupported type 'importmap'。真正有效的写法只有 type="application/importmap"，大小写敏感，多一个空格、少一个字母都不行。
常见错误包括：
– 写成 type="text/importmap" 或 type="importmap+json"
– 拼成 type="applcation/importmap"（少个 i）
– 用单引号包裹：type='application/importmap'（部分旧版 Safari 对引号类型敏感，建议统一用双引号）
importmap 必须在所有 type="module" 脚本之前，且只能放 head 里
如果 <script type="application/importmap"></script> 放在 底部，或在某个 <script type="module"></script> 之后，浏览器解析到 import 语句时映射还没加载，直接报 Failed to resolve module specifier。
验证方式：
– 打开 DevTools → Elements → 确认该 <script></script> 在 内，且位于所有 type="module" 标签之前
– 运行 document.querySelector('script[type="application/importmap"]')，返回非 null 才算加载成功
– 不要放多个 type="application/importmap"，只有第一个生效，其余被丢弃
映射目标 URL 必须返回合法 ES 模块，且 Content-Type 正确
即使 JSON 写对了，只要映射指向的地址返回非 ES 模块（比如 CommonJS 包、HTML 页面、404），就会卡在 TypeError: Failed to fetch dynamically imported module 或 Cannot assign to read only property 'exports'。
关键检查点：
– CDN 路径必须带 ESM 后缀：jsDelivr 用 +esm（如 https://cdn.jsdelivr.net/npm/lodash@4.17.21/+esm），unpkg 用 ?module，Skypack 直接可用
– 本地路径（如 "utils":"./src/utils.js"）需确保服务器返回 Content-Type: application/javascript，不能是 text/plain 或 404
– 路径必须是完整 URL 或相对路径（从 HTML 文件位置解析），不支持 bare specifier 自动补全，也不支持通配符或 // 协议相对路径
兼容性兜底：旧浏览器没 importmap 就不执行模块脚本
Chrome 115+、Firefox 119+、Safari 16.4+ 原生支持 type="application/importmap"；IE、Edge 18 及更早、Android WebView
安全做法：
– 不依赖 importmap 做核心功能降级，而是用构建工具（Vite/Webpack）生成兼容 bundle 作为 fallback
– 用特性检测隔离模块逻辑：if ('importMap' in document.createElement('script')) { /* 加载 module 脚本 */ } else { /* 加载传统 bundle */ }
– 别试图用 try/catch 捕获 importmap 失效，它本身不抛异常，只是后续 import 报错
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
