base href不能设为二级域名路径（如sub.example.com/），必须以http://、https://、//或/开头；正确写法是https://sub.example.com/或//sub.example.com/，否则标签被静默忽略导致404。
base href 能不能设成二级域名路径
不能直接用二级域名“路径”作为 href 值，比如 <base href="sub.example.com/"> 是非法的——浏览器只认以 https://、http://、// 或 / 开头的值，其他一律静默忽略。
如果你的资源托管在二级域名（如 https://assets.example.com/），必须写完整协议+域名+结尾斜杠：
-
<base href="https://assets.example.com/">✅ 合法且推荐 -
<base href="//assets.example.com/">✅ 协议相对，适合混用 HTTP/HTTPS 环境 -
<base href="assets.example.com/">❌ 无协议，被丢弃 -
<base href="/assets/">❌ 这是根相对路径，指向当前主域名（如example.com）下的/assets/，不是二级域名
二级域名部署时，<base> 和当前页面 URL 的关系
关键点：浏览器不会自动把当前页面所在二级域名（如 https://app.example.com/）当作 <base> 的默认上下文。你写的 href 必须显式声明目标域名，否则它就按当前页解析——这很容易导致资源从 app.example.com 下加载，而不是你期望的 assets.example.com。
常见翻车场景：
- 页面在
https://app.example.com/dashboard，但忘了配<base href="https://assets.example.com/">，结果<img src="logo.png">请求发到了https://app.example.com/logo.png→ 404 - 用了
<base href="/cdn/">，本意是走 CDN，实际却拼成https://app.example.com/cdn/logo.png，完全没命中二级域名
SPA 部署在二级域名子路径时怎么配
如果应用本身跑在 https://app.example.com/myapp/，同时资源又托管在 https://assets.example.com/v2/，这时不能只靠一个 <base> 解决所有问题——它只能管 HTML 层的相对路径，而前端路由和构建工具需要各自独立配置。
必须三者对齐：
- HTML：
<base href="https://assets.example.com/v2/">（确保script、link、img正确加载） - Vite：
build.base = "https://assets.example.com/v2/"（避免构建产物路径错位） - Vue Router：
createRouter({ history: createWebHistory('/myapp/') })（路由 base 是路径前缀，和资源域名无关）
⚠️ 注意：createWebHistory('/myapp/') 中的 /myapp/ 是相对于当前页面 URL（即 app.example.com）的路径，和 <base href> 的域名毫无关系——这两个 base 完全不互通，也不能互相替代。
为什么本地开发时容易误判二级域名配置
本地起服务（如 http://localhost:5173）时，<base href="https://assets.example.com/"> 能正常加载资源，但上线后可能因跨域或 CSP 被拦截；反过来，如果本地用 <base href="/assets/"> 跑通了，上线到二级域名就必然 404。
真正可靠的验证方式只有两个：
- 打开 DevTools 的 Network 面板，看
<img src="icon.svg">实际发出的请求 URL 是不是你预期的二级域名地址 - 禁用 JavaScript，纯靠 HTML 加载资源，确认
script和link是否仍能拉取成功——这是检验<base>是否生效的黄金标准
最常被忽略的一点：即使 <base> 配对正确，若后端未在二级域名上正确配置 CORS 或 HTTPS 证书，资源仍会加载失败，但错误类型是网络层拦截，不是 404，容易误判为配置问题。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
