Vue项目中不能直接跳转HTML页面，因其为SPA，路由由Vue Router管理；需用window.location.href跳转同域静态HTML（须放public目录），或配置routes映射.html路径。
Vue 项目里不能直接“跳转 HTML 页面”——它不是传统多页应用，而是单页应用（SPA），所有路由由 Vue Router 管理；所谓“跳转 HTML”，实际是两种不同场景：一种是跳到同域下非 Vue 管理的静态 HTML（比如 legacy 页面），另一种是误以为要绕过路由系统手动 location.href。前者可行但需谨慎，后者通常不该做。
用 window.location.href 跳转外部或静态 HTML 页面
这是最直接的方式，适用于跳转到项目目录下某个纯 HTML 文件（如 about.html），或同域其他子路径下的静态页。
- 确保该 HTML 文件放在
public/目录下（Vue CLI）或构建后能被 Web 服务器直接访问的路径，否则 404 - 不要在
src/里放 HTML 并试图 import —— 它不会被解析为页面，只是字符串 - 跳转后 Vue 实例会销毁，状态丢失；返回时不会恢复路由历史，除非服务端配合支持
- 示例：
window.location.href = '/about.html'（注意开头的/表示根路径，不是相对路径）
用 router.push 跳转时为什么报错 “No match found for location with path”
这是新手最常遇到的错误，本质是试图用 Vue Router 的 API 去跳一个没在 routes 里声明的 HTML 路径，比如 router.push('/login.html')。
- Vue Router 只处理它知道的路由配置，
.html后缀不参与匹配，也不代表真实文件存在 - 如果你真需要把
/login.html映射成一个路由，得在routes里加一条：{ path: '/login.html', component: LoginView } - 更合理的做法是统一用语义化路径（如
/login），避免暴露后缀，也利于 SEO 和服务端 fallback 配置 - 开发时若用
history模式，未配 nginx/apache fallback，跳转后刷新会 404 —— 这和跳 HTML 无关，是 history 模式通病
从 Vue 页面跳到同域其他 HTML 页面（如后台管理系统旧版）
典型场景：Vue 前端嵌入老系统，或灰度迁移时保留部分 PHP/ASP 页面入口。
立即学习“前端免费学习笔记（深入）”；
- 优先用
window.open(url, '_blank')，避免污染当前 SPA 的 history 和内存状态 - 如果必须复用当前窗口，用
window.location.replace(url)替代href，防止用户点返回回到 Vue 页面导致状态错乱 - 跨子域（如
app.example.com→admin.example.com）要注意 cookie 和 localStorage 隔离，JS 无法直接读取 - 别在
beforeRouteLeave里异步拦截跳转再执行location.href—— 浏览器可能已开始导航，行为不可靠
真正麻烦的不是怎么跳，而是跳完之后：HTML 页面有没有自己的 JS 初始化逻辑？会不会和 Vue 共享的全局变量冲突？要不要清空 localStorage 中的 token？这些细节没人替你兜底。
