标签直接重置html解析器对所有后续相对url的基准起点，必须置于最前且唯一，href值须为绝对url或以/开头结尾带斜杠的根相对路径，否则静默失效导致资源404；仅影响html属性中纯相对路径（如src、href），不影响js/css运行时路径。
<base> 标签不是“可有可无”的装饰，它直接决定页面里所有 src、href、action 等相对路径的解析起点。用错或漏配，logo.png 就会 404，style.css 就加载失败，而你可能还在查网络请求头。
base href 必须是绝对 URL 或根相对路径，否则浏览器静默忽略
浏览器只认以 https://、http://、// 或 / 开头的 href 值。其他写法（比如 static/、../assets、https://example.com）会导致整个 <base> 被丢弃——你不会看到控制台报错，但所有相对路径仍按当前页面 URL 解析，结果就是一堆 404。
常见翻车点：
-
<base href="static/">：缺协议和域名，被忽略 -
<base href="../assets/">：含..，非法，被忽略 -
<base href="https://example.com">：结尾没斜杠，Firefox/Opera 会截断成https://example.comcss/main.css -
<base href="/myapp">：结尾没斜杠，同样危险，应写成/myapp/
哪些资源受 base 标签影响，哪些完全不受
<base> 只在 HTML 解析阶段起作用，改写的是相对 URL 的初始解析逻辑，不是运行时重写。
✅ 受影响（解析时拼接基准）：
<img src="logo.png"><link href="style.css"><a href="about.html"></a><form action="submit.php"></form>- CSS 中的
background: url(avatar.jpg)
❌ 完全不受（走 JS 或 CSS 自有解析规则）：
fetch('./api/user')import('./utils.js')new Worker('./worker.js')- CSS
@import "reset.css" -
<iframe src="page.html"></iframe>（注意：不是srcdoc）
⚠️ 半受影响：
-
document.baseURI返回<base href>的值，可用于new URL('data.json', document.baseURI) -
window.location和document.URL完全不变
SPA 部署在子路径时，base 标签和前端路由必须协同配置
Vue Router 的 base 配置项和 HTML 的 <base href="/subpath/"> 是两套独立机制，不自动同步。只设一个，另一个大概率出问题。
- HTML
<base href="/subpath/">是为了让<script src="js/app.js"></script>正确加载，否则 chunk 404 - Vue Router / React Router v6+ 必须显式配置
base: '/subpath/'，否则router.push('/home')会跳到根路径/home而非/subpath/home - Service Worker 若缓存策略依赖
self.location.origin + '/subpath/'，而 HTML 没配<base>，预缓存路径就错了 - 微前端场景下，子应用若同时设了 Webpack
publicPath和<base>，资源路径可能被拼两次，变成/subpath/subpath/js/app.js
为什么建议优先用构建工具而非手动写 base 标签
硬塞 <base> 是“补丁式”方案。本地开发、测试环境、CDN、子目录部署……不同上下文需要不同 href 值，手动维护极易出错。
更稳妥的做法：
- Webpack/Vite 构建时通过
HtmlWebpackPlugin注入<base href="%7B%7B%20publicPath%20%7D%7D"> - 确保
publicPath值合法：以/开头（根相对）或含完整协议（如https://cdn.example.com/v2.3/） - 禁用 JavaScript 动态插入
<base>：DOM 插入太晚，无法修正浏览器已解析的 URL 基准 - 服务端模板（如 Hugo、Jekyll）用变量注入，避免硬编码
真正容易被忽略的点在于：<base> 的生效时机极早——它必须出现在 最上方，且在任何 <link>、<script></script> 之前；一旦位置错，后续所有相对路径都已按错误基准解析完毕，再改也来不及。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
