<base> 标签必须严格配置：href须以/或协议开头且结尾带斜杠，仅限<head>顶部唯一存在；仅影响HTML解析时的纯相对路径资源加载，对JS运行时路径无作用；SPA子路径部署需同时配base标签与路由base选项。
<base> 标签不是“可配可不配”的装饰项，它一旦写错，所有相对路径资源（src、href、action）都会静默退回到当前页面 URL 解析——上线后批量 404，且控制台零提示。
href 值必须以 / 或协议开头，且结尾带斜杠
浏览器只认 href 值以 https://、http://、// 或 / 开头，否则整条 <base> 被丢弃。这不是警告，是彻底失效。
-
<base href="assets/">→ 无效（缺协议/根路径） -
<base href="../static/">→ 无效（含..） -
<base href="https://cdn.example.com/v2">→ 无效（结尾没/，Firefox 可能拼成https://cdn.example.com/v2css/app.css） -
<base href="/myapp/">→ ✅ 合法（根相对，结尾有斜杠） -
<base href="https://cdn.example.com/v2/">→ ✅ 推荐（绝对 URL，部署可控）
必须放在 <head> 最顶部，且只能有一个
<base> 的作用发生在 HTML 解析阶段，它重置的是“后续所有相对 URL 的基准”。顺序错了，等于没写。
- 放在
<title>或<meta>后面 → 已解析的<link href="style.css">不受影响，仍按原页面 URL 加载 - 放在
<body>里 → 浏览器直接忽略 - SSR 模板中 header 和 page 各 render 一个
<base>→ 控制台报Multiple base elements detected. Only the first one is used.，第二个白写 - 用 JS 动态插入：
document.head.appendChild(baseEl)→ 解析早已完成，已存在的<img src="x">不会重算
哪些路径真受影响，哪些完全不管
<base> 只改写 HTML 解析时遇到的纯相对路径（即不以 /、: 或协议开头的字符串），对运行时 JS 行为毫无影响。
立即学习“前端免费学习笔记（深入）”；
- ✅ 真受影响：
<img src="logo.png">、<script src="app.js">、<link href="main.css">、<form action="login.php">、CSS 中的background: url(avatar.jpg) - ❌ 完全不受影响：
fetch('./api/user')、import('./utils.js')、@import "reset.css"、new Worker('./worker.js')、<iframe src="page.html"> - ⚠️ 半受影响：
document.baseURI返回<base href>的值，可用于new URL('data.json', document.baseURI)；但window.location和document.URL完全不变
SPA 部署子路径时，base 标签和前端路由必须双配
Vue Router 的 base: '/subpath/' 和 HTML 中的 <base href="/subpath/"> 是两套独立机制，缺一不可。只设一个，必出问题。
- 只设
<base href="/subpath/">：JS chunk 能加载，但router.push('/home')会跳到/home（根路径），不是/subpath/home - 只设 Vue Router
base：chunk 文件请求路径仍是/assets/index.js，而非/subpath/assets/index.js，404 - 微前端下若子应用同时设了 Webpack
publicPath和<base>→ 资源路径可能被拼两次，变成/subpath/subpath/js/app.js
最容易被忽略的一点：构建工具（如 Vite 的 build.base、Webpack 的 publicPath）生成的 HTML 里，<base href> 值是否和实际部署路径严格一致？哪怕多一个空格、少一个斜杠，都会让整个静态资源链断裂。别信“看起来能跑”，要盯死 DevTools Network 里每个 src 和 href 请求的真实 URL。
