base href写成相对路径会静默失效；浏览器仅接受绝对url（如https://example.com/subapp/）或根相对路径（如/subapp/），其他写法均被忽略，导致所有相对路径仍按当前页面url解析而引发404。
base href写成相对路径会静默失效
浏览器对 <base href="assets/"> 这类写法直接忽略，不报错也不警告——所有 src、href 相对路径仍按当前页面 URL 解析，结果就是一堆 404。这不是 bug，是规范行为。
真正合法的 href 值只有两种：https://example.com/subapp/（绝对 URL，结尾必须带 /）或 /subapp/（根相对路径，开头和结尾都必须是 /）。
-
<base href="subapp/">→ 无效，被丢弃 -
<base href="../static/">→ 含..，规范禁止，丢弃 -
<base href="/subapp">→ 缺末尾/，Firefox/Opera 会把css/app.css拼成/subappcss/app.css -
<base href="%24%7BPUBLIC_PATH%7D">→ 若构建未替换，浏览器收到的是字面量字符串，照样失效
哪些资源真受base影响，哪些完全不受控
<base> 只在 HTML 解析阶段起作用，只改写纯相对路径（既无协议、也无 / 开头）的硬编码属性。它不是运行时重写器，更不干预 JS 或 CSS 的模块系统。
✅ 真生效：<img src="logo.png">、<script src="app.js"></script>、<link href="style.css">、<form action="submit.php"></form>、CSS 文件里的 background: url(icon.svg)（注意：这是 HTML 解析时计算的，不是 CSS 引擎自己 resolve）
❌ 完全不受控：fetch('./api/user')、import('./utils.js')、new Worker('./worker.js')、@import "reset.css"、<iframe src="/admin/frame.html"></iframe>、<img srcset="logo-2x.png 2x">
⚠️ 半受影响：document.baseURI 会返回 <base href> 的值，可用于 new URL('data.json', document.baseURI)，但 window.location 和 document.URL 完全不变。
SPA 部署子路径时 base 和框架路由配置必须严格对齐
Vue Router 的 createWebHistory('/subpath/') 和 HTML 的 <base href="/subpath/"> 是两套独立机制，互不同步。只配一个，另一个大概率出问题。
- 没配
<base href="/subpath/">→chunk-xxx.js加载 404（资源路径错） - 只配
<base href="/subpath/">，没设 Vue Router 的base→router.push('/home')跳到根路径，白屏 - Webpack 的
publicPath和<base href="/subpath/">同时配置且值相同 → 资源路径被拼两次，变成/subpath//subpath/js/app.js - Vite 已设
base: '/subpath/'，HTML 中再手动加<base>→ 重复生效，风险叠加
base 标签位置错误或重复声明毫无提示但效果丢失
<base> 必须是 的直接子元素，且只能有一个。放错位置或重复，浏览器不会报错，但行为不可靠。
- 放在
里 → 完全忽略，控制台无提示 - SSR 模板拼接导致两个
<base>→ 只有第一个生效，控制台可能提示Multiple base elements detected. Only the first one is used. - 用 JS 动态插入
document.head.appendChild(baseEl)→ 已解析的标签不受影响，只对后续新创建的元素生效 - 没放在
最顶部，前面有<link>或<script></script>→ 部分浏览器可能跳过解析
最稳妥的做法：在原始 HTML 源码中，确保 <base> 是 的第一个子元素，且仅出现一次。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
