<base> 标签是双刃剑：必须用绝对 URL 或根相对路径（以 / 或协议开头），且须置于 <head> 最前；仅影响纯相对路径的 src/href/action，对 fetch/import 等无效；SPA 部署时需与路由 base 及构建工具配置严格对齐。
<base> 标签不是“设个路径就完事”的配置项，它是一把双刃剑：用对了能统一资源加载逻辑，用错了会静默失效、引发大面积 404，且毫无提示。
href 值必须是绝对 URL 或根相对路径，否则整条 <base> 被浏览器忽略
浏览器只接受以 https://、http://、// 或 / 开头的 href 值。其他写法一律被丢弃，且不报错。
-
<base href="static/">→ 缺协议和域名，被忽略 -
<base href="../assets/">→ 含..，被忽略 -
<base href="https://example.com">→ 结尾没/，Firefox/Opera 会截断路径（css/app.css变成https://example.comcss/app.css） -
<base href="/subapp">→ 同样缺结尾/，风险同上；正确应为<base href="/subapp/">
生产环境推荐完整绝对 URL：<base href="https://cdn.example.com/v2.3/">；本地开发可用 <base href="http://localhost:3000/">，比 / 更安全，避免和后端路由冲突。
<base> 必须放在 <head> 最前面，且只能有一个
HTML 解析是自上而下进行的。<base> 的作用是为后续所有相对 URL 提供基准，所以它必须是 <head> 中第一个元数据类元素。
立即学习“前端免费学习笔记（深入）”；
- 错误顺序：
<head><title>My Page</title><link href="css/main.css"><base href="https://cdn.example.com/"></head>→main.css仍按当前页 URL 解析 - 正确顺序：
<head><base href="https://cdn.example.com/"><title>My Page</title><link href="css/main.css"></head> - 若文档中出现多个
<base>，只有第一个生效；写在<body>中则完全被忽略
哪些资源受 <base> 影响，哪些完全不受
<base> 只在 HTML 解析阶段起作用，改写的是 src、href、action 等属性中**纯相对路径**（即不以 /、: 或协议开头）的初始解析逻辑。
- ✅ 受影响：
<img src="logo.png">、<link href="style.css">、<script src="app.js">、<form action="submit.php">、CSS 中的background: url(avatar.jpg) - ❌ 完全不受：
fetch('./api/data.json')、import('./utils.js')、new Worker('./worker.js')、CSS@import "reset.css"、<iframe src="page.html"> - ⚠️ 半受影响：
document.baseURI返回<base href>的值，可用于构造 URL（如new URL('data.json', document.baseURI)），但window.location和document.URL完全不变
SPA 部署子路径时，<base href> 和前端路由必须严格对齐
Vue Router / React Router v6+ 的 base 配置项和 HTML 的 <base href="/subpath/"> 是两套独立机制，不自动同步。只设一个，另一个大概率出问题。
- HTML
<base href="/subpath/">是为了让<script src="js/app.js">正确加载，否则 chunk 404 - Vue Router 必须显式设
base: '/subpath/'，否则router.push('/home')会跳到根路径 - Webpack 的
publicPath和 Vite 的build.base若与 HTML<base>值相同，可能造成路径拼接两次（如/subpath//subpath/js/app.js） - Service Worker 缓存策略若依赖
self.location.origin + '/subpath/'，而 HTML 没配<base>，预缓存路径就错位
最稳妥的做法是：构建工具统一控制资源前缀（如 Vite 的 build.base），HTML 中不再手动写 <base>；除非你明确需要 target 行为或 CSS url() 重写。
