nomodule必须与type="module"成对使用，单独存在无效；现代浏览器执行module脚本并跳过nomodule，旧浏览器则执行nomodule脚本；需确保legacy-bundle.js为ES5兼容IIFE/UMD格式，并手动引入polyfill；Safari 10.1存在双执行问题，须用运行时检测规避。
nomodule 必须和 type="module" 成对出现，单独写没效果
只写 <script nomodule src="legacy.js"></script> 会导致现代浏览器完全不加载它（连网络请求都没有），旧浏览器又可能因缺少兜底脚本而白屏。IE11 甚至会静默忽略整行标签——控制台看不到报错，但脚本根本没执行。
真正起作用的结构是两行并存：
<script type="module" src="app.mjs"></script> <script nomodule src="legacy-bundle.js"></script>
- 现代浏览器（Chrome 61+、Firefox 60+、Safari 11+）执行
app.mjs，跳过legacy-bundle.js - 旧浏览器（IE11、Android 4.4 WebView）不认识
type="module"，直接跳过第一行；但会加载并执行第二行 - 顺序无关，但推荐模块优先，符合直觉且便于维护
legacy-bundle.js 必须是真正 ES5 兼容的 IIFE/UMD 格式
nomodule 只管“要不要加载”，不管“能不能运行”。哪怕脚本进了 IE11，以下任一情况都会立刻崩溃：
- 语法层面：含
const、let、=>、${}、class→ 直接SyntaxError - API 层面：调用
fetch()、Promise、Array.from()、Object.assign()→ReferenceError或静默失败 - DOM 层面：用
element.classList.add()（IE9–）、querySelector()（IE7–）、addEventListener()（IE8–）→ 报错或无响应
构建时必须显式设 targets: { ie: "11" }，不能依赖 Babel 默认 preset；core-js/stable 需手动引入，且 polyfill 必须在所有业务代码之前执行；输出格式只能是 IIFE 或 UMD，严禁含 import/export，禁用 dynamic import()。
立即学习“前端免费学习笔记（深入）”；
Safari 10.1 会双执行，需要运行时规避
Safari 10.1（macOS 10.12.4 / iOS 10.3）识别 type="module"，却错误地也执行 nomodule 脚本，导致 UI 初始化两次、事件重复绑定、数据请求翻倍。
最稳妥的缓解方式是加一层运行时检测，只在“半吊子”浏览器中注入 fallback：
if (!('noModule' in document.createElement('script'))) {
const s = document.createElement('script');
s.src = 'legacy-bundle.js';
document.head.appendChild(s);
}
这段逻辑本身要放在 type="module" 脚本之前，且需确保它自身是纯 ES5、无依赖的内联脚本。
不要把 nomodule 脚本打包进现代 bundle
如果构建产物里把 legacy-bundle.js 打包进了 app.mjs，就彻底失去意义——它必须是独立、编译后的文件，否则现代浏览器下载了冗余代码，旧浏览器又拿不到可执行内容。
老浏览器执行 nomodule 脚本时默认同步阻塞解析，所以建议：
- 压缩体积，避免超过 100KB
- 关键初始化逻辑可考虑内联到 HTML 中（如基础 polyfill + DOM 就绪检测）
- 避免在
nomodule脚本里做 UA 判断再异步加载其他资源——旧浏览器解析慢，极易超时或失败
真正容易被忽略的是：nomodule 不是兼容开关，而是加载过滤器；它的有效性完全依赖构建产物是否真正隔离、语法是否真正降级、以及 Safari 10.1 这类边缘版本的运行时行为。
