base href 必须是绝对 URL 或根相对路径，否则静默失效；仅影响 HTML 解析阶段的纯相对路径属性，如 src、href、action 等，对 JS/CSS 运行时路径无效。
base href 必须是绝对 URL 或根相对路径，否则静默失效
浏览器只认 href 值以 https://、http://、// 或 / 开头的写法，其他一律丢弃——不报错、不警告，但所有 src="logo.png" 都退回到按当前页面 URL 解析，上线后批量 404。
常见无效写法：
-
href="assets/"（缺协议和根斜杠） -
href="../static"（含..） -
href="/myapp"（结尾没斜杠，Firefox 可能截断成/myappcss/） -
href="%PUBLIC_URL%/"（服务端未替换就发到浏览器）
✅ 推荐写法：
-
href="https://cdn.example.com/v3/"（绝对 URL，部署可控） -
href="/myapp/"（根相对路径，结尾必须带斜杠） -
href="//cdn.example.com/v3/"（协议相对，自动继承当前协议）
base 标签必须放在 <head> 最顶部且唯一
<base> 的作用是重置 HTML 解析器对后续所有相对 URL 的基准起点，这个动作只在解析阶段生效，且仅对它之后出现的标签起效。放错位置等于没写。
立即学习“前端免费学习笔记（深入）”；
正确顺序示例：
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
<head> <base href="/myapp/"> <title>My App</title> <link rel="stylesheet" href="main.css"> <script src="app.js"></script> </head>
错误情况：
- 放在
<meta>或<title>后面 → 部分浏览器跳过已解析的<link>，资源仍按原始 URL 加载 - 放进
<body>→ 浏览器直接忽略，无提示 - 多个
<base>→ 只有第一个生效，控制台提示Multiple base elements detected. Only the first one is used. - 用 JS 动态插入（如
document.head.appendChild(baseEl)）→ 解析阶段早已结束，完全无效
哪些 HTML 属性真受影响，哪些完全不管
<base> 不是全局路径重写器，它只在 HTML 解析阶段改写纯相对路径（即不以 /、: 或协议开头的字符串），对运行时行为毫无作用。
✅ 明确受影响（HTML 属性中硬编码的相对路径）：
<img src="logo.png"><script src="app.js"><link href="style.css"><form action="submit.php">- CSS 文件中
background: url(avatar.jpg)（注意：这是 HTML 解析时计算的，不是 CSS 运行时）
❌ 完全不受影响（JS/CSS 运行时路径）：
fetch('./api/user')import('./utils.js')@import "reset.css"new Worker('./worker.js')-
<iframe src="page.html">（src是动态加载，不走base）
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、style.css等静态资源因无<base>仍按当前页面 URL 解析，大概率 404 - Vite 用户注意：
build.base配置会自动注入<base>，但若手动再写一个，可能造成双base冲突
真正容易被忽略的是：CSS 中的 url() 看似“在 CSS 里”，实则由 HTML 解析器提前处理；而 JS 的 import() 和 fetch() 则彻底绕过它——这两类路径得各自单独处理，不能指望一个 <base> 全局兜底。
