标签必须为绝对 url 或根相对路径（结尾带斜杠），且须置于 最顶部唯一存在；仅影响其后 html 中纯相对路径的解析，对 js/css 动态路径无效；spa 和微前端需与路由、构建配置协同，否则导致资源 404 或路由错位。
<base> 标签不是“设了就完事”的配置项，它一旦写错，浏览器既不报错也不警告，所有相对路径照常解析——只是基准全错了，上线后批量 404。
href 值必须是绝对 URL 或根相对路径（结尾带斜杠）
浏览器只认以 http://、https://、// 或 / 开头的 href 值。其他写法一律静默丢弃。
-
<base href="static/">❌ 缺协议和域名，无效 -
<base href="../assets">❌ 含..，不被识别 -
<base href="https://example.com">❌ 结尾没/，Firefox 可能截断成https://example.comcss/ -
<base href="https://cdn.example.com/v3/">✅ 推荐：绝对 URL，部署稳定 -
<base href="/myapp/">✅ 合法：根相对路径，结尾斜杠不可省
必须放在
<base> 的作用时机是 HTML 自上而下解析过程，它只影响其后出现的相对路径。顺序或数量错，等于没写。
- 放在
里 → 浏览器直接忽略，无提示 -
<title>...</title> <base href="/app/">→<title></title>不受影响，但后续<link href="style.css">会按新基准解析；不过更稳妥的是把<base>放在<title></title>之前 - SSR 模板拼接出两个
<base>→ Chrome 控制台提示Multiple base elements detected. Only the first one is used.，第二个被忽略 - 用 JS 动态插入：
document.head.appendChild(baseEl)→ 解析已结束，对已存在的元素完全无效
只影响 HTML 解析阶段的纯相对路径，JS 和 CSS 有例外
<base> 是 HTML 解析层规则，不是运行时全局代理。它只改写特定属性中“纯相对路径”（即不以 /、: 或协议开头）的初始拼接逻辑。
- ✅ 明确受影响：
<img src="logo.png">、<script src="app.js"></script>、<link href="style.css">、<form action="submit.php"></form>、CSS 中的background: url(avatar.jpg) - ❌ 完全不受影响：
fetch('./api/user')、import('./utils.js')、@import "reset.css"、<iframe src="/admin/frame.html"></iframe>（根相对路径） - ⚠️ 半受影响：
document.baseURI返回<base href>的值，可用于new URL('data.json', document.baseURI)；但window.location和document.URL完全不变
SPA 部署子路径时，<base href> 和前端路由必须配对设置
Vue Router 的 base: '/subpath/' 和 HTML 中的 <base href="/subpath/"> 是两套独立机制，缺一不可。
- 只设
<base href="/subpath/">：JS chunk 能加载，但router.push('/home')会跳到/home（根路径），不是/subpath/home - 只设 Vue Router
base：chunk 加载 404，因为src="assets/index.js"仍按当前页面 URL 解析 - 微前端场景下，若子应用同时设了 Webpack
publicPath和<base>，资源路径可能被拼两次，变成/subpath/subpath/js/app.js - Vite 的
build.base会自动注入<base href>，但开发时仍需确认base配置与实际部署路径一致
最容易被忽略的点是：所有检查都得在 DevTools 的 Network 面板里验证真实请求地址——不能只看 HTML 源码里的 src 值，因为 <base> 是否生效，最终只体现在发出的 HTTP 请求 URL 上。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
