标签重置html解析器对纯相对路径的基准起点，非“加前缀”；href必须为绝对url或根相对路径（结尾带斜杠），且须置于最前、唯一存在，否则静默失效致404。
<base> 标签不是“加前缀”，而是重置 HTML 解析器对所有纯相对路径的基准起点——设错一个字符，<img src="logo.png"> 就 404，且浏览器通常不报错，只静默失败。
base href 必须是绝对 URL 或根相对路径（结尾带斜杠）
浏览器只认以 https://、http://、// 或 / 开头的 href 值。其他写法（如 "assets/"、"../static/"、"%PUBLIC_URL%/"）会被静默丢弃，后续所有相对路径退回到按当前页面 URL 解析。
-
https://cdn.example.com/v3/✅ 推荐：协议、域名、路径明确，CDN 场景最稳妥 -
/myapp/✅ 合法：根相对路径，但结尾斜杠不能少（/myapp在 Firefox 中可能被截断为/myappcss/） -
//cdn.example.com/v3/✅ 可用：协议相对，自动继承当前页 http/https -
assets/❌ 无效：缺协议和域名，标签被忽略 -
../public/❌ 无效：含..，不被识别 -
/myapp❌ 危险：结尾无斜杠，部分浏览器拼接时会粘连（如style.css→/myappstyle.css）
base 必须放在 最顶部，且只能有一个
<base> 的作用时机是 HTML 解析阶段，它只对它之后出现的标签生效。放错位置或重复声明，等于没写。
- 正确顺序：
<base href="/myapp/"> <title>App</title> <link href="style.css"> - 错误示例：
<title>App</title> <base href="/myapp/"> <link href="style.css">→style.css已按原始 URL 解析完毕，不受控 - 禁止写在
里：浏览器直接忽略，无提示 - 多个
<base>：只有第一个生效；Chrome 控制台会输出Multiple base elements detected. Only the first one is used. - 服务端模板（如 Express/Nunjucks）中注意拼接逻辑，避免 header 和 page 各 render 一个
<base>
哪些路径真受影响，哪些完全不管
<base> 只影响 HTML 解析阶段的纯相对路径（即不以 /、: 或协议开头），对 JS/CSS 运行时行为毫无作用。
- ✅ 真受影响：
<img src="logo.png">、<script src="app.js"></script>、<link href="theme.css">、<form action="submit.php"></form>、CSS 中的background: url(avatar.jpg)（这是唯一穿透到 CSS 的情况） - ❌ 完全不受影响：
fetch('./api/data.json')、import('./utils.js')、new Worker('./worker.js')、CSS 中的@import "reset.css"、<iframe src="page.html"></iframe>（它的src相对于 iframe 当前 URL） - ⚠️ 特别注意：
href="/admin"这种根相对路径，根本不受<base>控制——它直接拼到当前域名下，和href值无关
SPA 项目里慎用，前端路由必须显式对齐
<base href="/myapp/"> 不会让 Vue Router 或 React Router 自动识别子路径。它们完全不读 document.baseURI，必须手动传入 base 配置项。
- Vue Router：
createRouter({ base: '/myapp/' })，否则router.push('/home')会跳到根路径 - React Router v6+：
<router basename="/myapp"></router>，否则导航和匹配全部错位 - Webpack/Vite 的
publicPath或base配置若和 HTML 中的<base>值重复，会导致资源路径被拼两次（如/myapp//myapp/js/app.js） - 构建工具（Vite/Webpack）自动生成
<base>比手写更可靠，能规避环境变量未替换、路径硬编码等问题
最容易被忽略的是：它只在解析那一刻起效，之后任何 JS 动态插入或修改都无效；而很多 404 问题，恰恰发生在你反复检查 JS 路径却忘了 <base> 的 href 值是否合法、是否放对了位置。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
