加了crossorigin的仍捕获不到css加载错误，是因为crossorigin仅声明cors请求模式，onerror能否触发取决于服务端是否返回匹配的access-control-allow-origin响应头；未配对时事件被静默忽略，且document.stylesheets中不可见该样式表。
为什么加了 crossorigin 的 <link rel="stylesheet"> 还是捕获不到 CSS 加载错误
因为 <link> 标签加了 crossorigin 只是声明“我要走 CORS 流程”，但浏览器是否触发 onerror、能否读取 CSSOM，取决于服务端是否返回匹配的 Access-Control-Allow-Origin 响应头。没配对，onerror 会被静默忽略，或只抛空事件。
- 必须显式写
crossorigin="anonymous"（不能只写crossorigin或crossorigin=""） - 服务端响应中必须包含
Access-Control-Allow-Origin: *或精确域名，否则样式表加载失败且无提示 - 若用了
crossorigin="use-credentials"，服务端还得返回Access-Control-Allow-Credentials: true，否则请求直接被拒 - 本地
file://协议下，crossorigin完全无效——必须用 HTTP 服务启动页面
window.onerror 捕获不到 CSS 加载失败的堆栈？不是 JS 错误，根本不在它监听范围内
window.onerror 只捕获脚本执行错误（<script></script>）、资源加载失败（<img>、<script></script>）等有限类型，<link rel="stylesheet"> 的加载失败默认不触发它。想监控 CSS 加载状态，得靠原生事件：
- 给
<link>绑定onload和onerror：只有加了crossorigin且服务端配对响应头，onerror才能拿到有效事件 - 没加
crossorigin时，跨域 CSS 加载失败会静默丢弃，onerror不触发，document.styleSheets里也看不到该样式表 - 动态插入的
<link>必须在appendChild()前设置好crossorigin属性，否则无效
加了 crossorigin 却读不了 document.styleSheets[0].cssRules？检查服务端是否漏了响应头
即使 CSS 加载成功，想用 JS 读取其规则（比如做样式覆盖率分析、主题切换校验），也必须满足两个条件：标签带 crossorigin + 服务端返回 Access-Control-Allow-Origin。否则访问 cssRules 会直接抛 SecurityError。
-
crossorigin="anonymous"对应服务端返回Access-Control-Allow-Origin: *即可 - 如果服务端只返回
Access-Control-Allow-Origin: https://your-site.com，而页面跑在http://localhost:3000，仍会失败 - Nginx 或 CDN 配置里漏了
add_header Access-Control-Allow-Origin "*";，或只加在location /而没覆盖 CSS 路径，都会导致读取失败 - 某些构建工具（如 Vite）默认不给动态注入的
<link>加crossorigin，需手动补上
Webpack/Vite 构建时生成的 CSS chunk 默认不带 crossorigin，错误监控形同虚设
现代打包工具输出的异步 CSS（比如 import('./theme.css') 触发的 chunk），HTML 中不会自动插入带 crossorigin 的 <link> 标签。这意味着你监控不到它的加载失败，也无法读取其规则。
- Webpack：需在
output.crossOriginLoading设为'anonymous'（注意：这个配置只影响 JS chunk，CSS chunk 仍需插件干预） - Vite：
build.rollupOptions.output.crossOrigin对 CSS 无效；推荐用插件（如vite-plugin-html）在生成的<link>标签上注入crossorigin="anonymous" - 手动 hack 方案：在
index.html中预置一个带crossorigin的空<link>，后续 JS 动态改href，确保属性始终存在
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
