HTML中base标签部署到子目录的配置技巧-html教程-PHP中文网

base href必须是绝对URL或根相对路径（如/myapp/），否则浏览器静默忽略，导致所有相对路径按当前页URL解析而批量404；必须置于最前且唯一，仅影响HTML解析阶段其后的纯相对路径。

html中base标签部署到子目录的配置技巧

base href必须是绝对URL或根相对路径，否则静默失效

浏览器遇到这种写法，会直接忽略整个标签——不报错、不警告，但所有都按当前页面URL解析，上线后批量404。真正有效的只有两类：https://cdn.example.com/v3/（推荐用于CDN）和/myapp/（根相对路径，结尾斜杠不能少）。常见翻车点：../static/、%PUBLIC_URL%/、https://example.com（缺尾斜杠）全部无效。

base必须放在最前面且唯一

的作用只在HTML解析阶段生效，且仅对它之后出现的标签起效。放错位置等于没写：

放在或后面 → 已解析的仍按原始URL加载，404
放进里 → 浏览器直接忽略，控制台无提示
多个 → 只有第一个生效，Chrome会提示Multiple base elements detected. Only the first one is used.
用JS动态插入 → 解析早已完成，完全无效

base和前端路由配置必须严格对齐，缺一不可

和Vue Router的createWebHistory('/myapp/')是两套独立机制，只配一个大概率出问题：

htmlppt.skill

把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。

下载

只设 → JS chunk能加载，但router.push('/home')跳到https://example.com/home（不是/myapp/home）
只设Vue Router的base → 路由跳转正常，但<script src="app.js"></script>请求https://example.com/app.js，而实际文件在/myapp/app.js，404
React Router v6+ 同样需显式传入basename="/myapp/"，它不读document.baseURI

Vite/Webpack构建配置与base标签重复拼接的坑

构建工具已配路径前缀时，再手动加会导致资源路径被拼两次：

Vite设了build.base: '/myapp/' → HTML中就不该再写，否则app.js变成/myapp//myapp/assets/index.js
Webpack设publicPath: '/'但HTML又写了 → runtime chunk从/myapp/加载，而实际文件在/下，404
微前端场景下，子应用若同时设publicPath和，可能变成/myapp/myapp/js/app.js