Base标签在SPA中必须与路由配置严格对齐，否则会导致锚点失效、资源404、跳转异常；href值须为绝对URL或根相对路径（如"/myapp/"），漏斜杠或多斜杠均引发路径拼接错误，且浏览器静默忽略无效写法。
Base 标签在 SPA 中不是“可选配置”，而是必须与路由系统严格对齐的全局解析规则；配错一个字符（比如漏斜杠、多一层路径），就会导致锚点失效、资源 404、跳转重载，且浏览器不报错。
href="#" 点击后页面闪一下、滚动回顶？base 标签正在劫持你的锚点
这是最典型的静默故障：你写 <a href="#section2">跳到第二节</a>，页面却刷新或滚到顶部。根本原因不是 JS 没绑事件，而是 <base href="/myapp/"> 让浏览器把 #section2 解析成 /myapp/#section2 —— 这个 URL 被当成新地址触发了完整导航。
- 所有以
#开头的href值，在有<base>时都会被拼接进 base URL，变成绝对路径请求 - 浏览器发现
/myapp/#section2没对应 HTML 文档，就重新加载/myapp/，导致滚动重置 - 解决方案不是删
<base>，而是改写链接：<a href="javascript:void(0)" onclick="document.getElementById('section2').scrollIntoView()"></a>，或用event.preventDefault()拦截
Vue Router / React Router 跳转仍刷新？base 和 history 配置没对齐
即使用了框架路由，<base href="/myapp/"> 和 createWebHistory('/myapp/') 必须完全一致，否则 router.push('/home') 会生成 https://example.com/home 而不是预期的 https://example.com/myapp/home。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
- Vite 构建时若已设
build.base: '/myapp/'，HTML 中再手动加<base href="/myapp/">，会导致路径被拼两次（如/myapp//myapp/assets/index.js） - Webpack 的
publicPath设为'/'，但 HTML 有<base href="/myapp/">，则运行时 chunk 加载地址会是/myapp/xxx.js，而实际文件在/xxx.js，404 - 检查方式：打开 Network 面板，点跳转后看发起的请求 URL 是否符合你部署的静态资源路径
target="_blank" 看着方便，却让所有没声明 target 的 a 标签悄悄新开页
<base target="_blank"> 是隐形炸弹。它不只影响你写的链接，还会让第三方组件里所有没显式写 target 的 <a> 标签默认新窗口打开——包括 <a href="#">、<a href="mailto:...">，甚至表单提交按钮生成的链接。
立即学习“前端免费学习笔记（深入）”；
- 副作用极难排查：控制台无报错，Network 也看不到异常请求，只有用户反馈“点啥都开新页”
- 修复方法：删掉
<base target="...">，需要新窗口的地方显式写target="_blank" rel="noopener" - 如果必须统一 target，改用 JS 动态绑定：
document.querySelectorAll('a:not([target])').forEach(a => a.target = '_blank')
最容易被忽略的点是：base 标签只在 HTML 解析阶段生效，它不会改变 window.location 或 document.URL，也不会影响 fetch()、import()、new Worker() 这些 API 的路径解析逻辑。你以为它“全局生效”，其实它只管硬编码在 HTML 里的 src、href、action——这点一旦混淆，调试就会陷入死循环。
