<base>标签仅在HTML解析阶段重置纯相对URL（如logo.png）的解析起点，必须为绝对URL或根相对路径（以/开头），否则静默失效；不控制JS/CSS动态路径、前端路由需单独配置base参数。
<base> 标签在多级路由中不能“重构”相对路径，它只在 HTML 解析阶段重置纯相对 URL 的解析起点；写错值、放错位置或与前端路由/构建配置冲突，反而会让 img、script、link 全部 404。
base href 必须是绝对 URL 或根相对路径，否则静默失效
浏览器对 <base href="..."> 的校验非常严格：只要值不是以 http://、https://、// 或 / 开头，整条标签就被丢弃——不报错、不警告，后续所有相对路径仍按当前页面 URL 解析。
-
href="assets/"、href="../static/"、href="subapp/"→ 全部无效，<base>形同虚设 -
href="/a/b/c"→ 结尾缺/，Firefox/Opera 会截断路径（如js/app.js拼成/a/b/cjs/app.js） -
href="/a/b/c/"→ ✅ 合法，适用于部署在https://example.com/a/b/c/的 SPA -
href="https://cdn.example.com/v3/"→ ✅ 推荐，协议、域名、版本全明确，不依赖当前页上下文
多级路由下 base 和前端路由必须显式对齐，不能靠 document.baseURI 自动推导
<base href="/myapp/"> 不会让 Vue Router 或 React Router v6+ 自动识别子路径；它们完全不读 document.baseURI，必须手动传入 base 配置项。
- Vue Router：
createRouter({ base: '/myapp/' })，否则router.push('/home')会跳到根路径 - React Router v6+：
<Router basename="/myapp">，否则导航和匹配全部错位 - 若 HTML 中写了
<base href="/myapp/">，但路由没配base，资源加载和页面跳转会“一半走 base、一半走根”，行为割裂 - Webpack/Vite 的
publicPath或base配置若和 HTML 中的<base>值重复，会导致资源路径被拼两次（如/myapp//myapp/js/app.js）
哪些路径受 base 控制，哪些完全不受——别被名字骗了
<base> 只影响 HTML 解析阶段的纯相对属性值，JS 运行时构造的 URL、CSS @import、srcset、fetch() 全都不受影响。
立即学习“前端免费学习笔记（深入）”；
- ✅ 受控：
<img src="logo.png">、<script src="app.js">、<link href="style.css">、CSS 中的background: url(avatar.jpg) - ❌ 不受控：
fetch('./api/user')、import('./utils.js')、new Worker('./worker.js')、@import "reset.css"、<iframe src="/admin/frame.html"> - ⚠️ 半受控：
document.baseURI返回<base href>的值，可用于new URL('data.json', document.baseURI)，但window.location和document.URL完全不变
最容易被忽略的是：本地开发用 http://localhost:3000/ 作 href 比用 / 更安全，能避免和后端路由冲突；而生产环境走 CDN 时，用完整绝对 URL（如 https://cdn.example.com/v2.3/）比根相对路径更可控——因为根相对路径在 GitHub Pages、子目录代理等场景下极易指向错误根域。
