标签是硬性依赖，必须置于 顶部且唯一；href 必须为绝对 url 或根相对路径（如 /myapp/ 或 https://cdn.example.com/v3/），否则静默失效；仅影响 html 属性（src/href/action）和 css url()，不作用于 fetch、import、@import 或 。
<base> 标签不是“可选优化”，而是部署子路径或 CDN 资源时的硬性依赖——不写对，src、href、action 全部 404；写错位置或格式，浏览器静默忽略，连控制台警告都没有。
base href 必须是绝对 URL 或根相对路径，否则直接失效
浏览器只认四种开头的 href 值：http://、https://、//（协议相对）、/（根相对）。其他一律丢弃。
- ❌
<base href="static/">：缺协议也缺斜杠开头，被忽略 - ❌
<base href="../assets/">：含..，非法，静默失效 - ❌
<base href="/myapp">：结尾没斜杠，Firefox 会拼成/myappcss/main.css - ✅
<base href="https://cdn.example.com/v3/">：推荐，明确、可控、跨环境稳定 - ✅
<base href="/myapp/">：仅限 SPA 部署在子路径，必须带结尾斜杠
base 标签必须放在 最顶部，且只能有一个
它不是“放哪儿都行”的元数据，而是 HTML 解析器重设 URL 基准的开关——必须在解析任何 src 或 href 之前就生效。
- ❌ 放在
<title></title>后面：<link href="style.css">仍按当前页面 URL 解析 - ❌ 塞进
：<base href="/app/">完全被忽略 - ❌ SSR 模板中 header 和 page 分别 render 一个：
Multiple base elements detected. Only the first one is used. - ✅ 正确顺序：
<base href="/app/"> <title>...</title> <link href="style.css">
哪些地方真受影响，哪些完全不管
<base> 只在 HTML 解析阶段起作用，不是全局代理。很多你以为它能管的，其实根本绕不过去。
- ✅ 真受影响：
<img src="logo.png">、<script src="index.js"></script>、<form action="login.php"></form>、CSS 中的background: url(avatar.jpg) - ❌ 完全不管：
fetch('./api/data.json')、import('./module.js')、CSS @import "reset.css"、<iframe src="page.html"></iframe> - ⚠️ 半受影响：
document.baseURI返回<base href>的值，可用于new URL('data.json', document.baseURI)，但window.location不变
SPA 部署子路径时，base 和前端路由必须配对
Vue Router 的 base: '/subpath/' 和 HTML 中的 <base href="/subpath/"> 是两套独立机制，缺一不可。
- 只设
<base href="/subpath/">：JS chunk 能加载，但router.push('/home')会跳到/home（根路径），不是/subpath/home - 只设 Vue Router
base：JS 加载失败，因为index.js还是按当前页面 URL 解析，404 - Vite 用户注意：
build.base配置会自动注入<base>，但开发时需确认base是否已存在，避免重复
最容易被忽略的点：CSS 中的 url() 受影响，而 JS 的 import() 和 fetch() 完全不受控——这两类路径必须各自单独处理，不能指望 <base> 一把梭。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
