正确写法是type="application/importmap"，而非type="importmap"；必须置于<head>中且在所有type="module"脚本之前，内容为内联JSON格式的imports映射表。
script type="importmap" 是无效写法
HTML 规范中没有 type="importmap" 这个值，浏览器会直接忽略该 <script> 标签，不会解析其中的 JSON 内容。这是初学者最常踩的坑——把 importmap 当成 script 的 type，就像用 type="module" 那样写。
正确写法：type="importmap" 必须换成 type="application/importmap"
W3C 明确规定 import map 必须使用 MIME 类型 application/importmap+json（浏览器目前普遍接受简写 application/importmap）。它必须是 <script> 标签的 type 属性值，且内容为合法 JSON：
<script type="application/importmap">
{
"imports": {
"lodash": "https://cdn.jsdelivr.net/npm/lodash@4.17.21/index.js"
}
}</script>
- 必须放在所有
<script type="module">之前（否则模块加载时无法读取映射） - 不能带
src属性——import map 只支持内联 JSON，不支持外部文件 - JSON 中的 key 是导入标识符（如
"lodash"），value 必须是完整 URL 或相对 URL（但相对 URL 基于当前 HTML 页面 URL 解析，不是基于 script 标签位置）
常见错误现象和调试方法
如果 import map 没生效，大概率是以下原因：
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
- 控制台报错
Failed to resolve module specifier "lodash"→ 检查 import map 是否在 module script 之前、type是否拼错（比如写成import-map或importmap） - network 面板里没看到 import map 被加载 → 它不发起请求，只被 HTML parser 解析；用
document.querySelector('script[type="application/importmap"]')看是否能取到节点 - 映射的 URL 返回 404 或 MIME 不匹配 → 浏览器不会报明显错误，但后续
import 'lodash'会失败；可用curl -I <url>检查响应头Content-Type - 在非模块脚本中使用 import map → import map 仅对
type="module"和动态import()生效，普通<script>无视它
兼容性与降级注意事项
Chrome 115+、Firefox 119+、Safari 16.4+ 原生支持；Edge 同 Chrome。不支持的浏览器（如旧版 Safari）会把 type="application/importmap" 当作未知类型，直接跳过——这本身是安全的，但你要自己处理降级：
立即学习“前端免费学习笔记（深入）”；
- 不要依赖 import map 做核心逻辑兜底，它本质是优化手段
- 若需兼容，可配合构建工具（如 esbuild、vite）在打包时展开 imports，或用
<script nomodule>提供传统 UMD fallback - 服务端可通过 User-Agent 注入 polyfill（如 import-map-polyfill），但注意 polyfill 无法拦截原生
import，只能劫持动态import()
import map 的 value URL 必须同源或配置 CORS，这点容易被忽略——即使 CDN 支持 CORS，也要确认响应头含 Access-Control-Allow-Origin: *，否则模块加载会静默失败。
