start_url是用户点击桌面图标后浏览器实际加载的起点,必须同源、可访问、真实存在且返回html;子路径部署应使用"./"或显式子路径,spa推荐"/"配合history fallback,禁用带参数或hash的动态地址。

start_url 不是“当前页面路径”,也不是“随便写的首页地址”,它是用户点击桌面图标后浏览器实际加载的起点。这个值一旦设错,轻则跳转到 404,重则在微前端或子路径部署时整个应用启动失败。
必须满足同源与可访问性
start_url 必须指向一个真实存在、能返回 HTML 的 URL,且必须与当前站点同源(协议+域名+端口一致)。不能是跨域链接,也不能是带查询参数的动态地址(如 /?utm=home),否则 iOS 和部分 Android 浏览器会拒绝安装。
- HTTPS 环境下,推荐写成
"start_url": "./"或"start_url": "/" - 本地开发用
localhost可省略 HTTPS 要求,但上线后必须走真实证书 - 服务端需支持 history fallback(尤其对 SPA),否则刷新页面会 404
子路径部署要避开根路径陷阱
如果你的应用部署在子路径下,比如 https://example.com/myapp/,start_url 不能写成 "/myapp/" —— 开头的斜杠会让浏览器强制跳到站点根目录,导致资源找不到。
- 正确写法是
"start_url": "./"(相对当前上下文)或显式写"myapp/" - qiankun 等微前端子应用必须用
"./index.html",确保主应用挂载后仍能正确定位入口文件 - 避免写
.html后缀(除非服务端明确不支持 clean URL)
单页应用优先用根路径或相对路径
Vue、React、DVA、uniapp 等 SPA 项目,路由由前端控制,start_url 应指向能触发前端路由初始化的页面,通常是根路径或入口 HTML。
- 常规部署:用
"start_url": "/",配合服务端 history fallback - 静态托管(如 GitHub Pages、Vercel):用
"start_url": "./"更安全 - 不要写成
"start_url": "/index.html"—— 多数现代托管平台不鼓励显式后缀,且可能破坏路由逻辑
别让 start_url 带用户“迷路”
start_url 的作用是统一启动入口,不是记录用户上次停留的位置。它应该把用户带到应用的逻辑首页,而不是当前浏览页或登录页(除非你确定所有用户都需要先登录)。
- 避免使用 hash 路由起始页,如
"/#/",部分浏览器不识别 - 不要依赖 query 参数做状态判断,start_url 应该是稳定、可缓存、语义清晰的路径
- 测试方法:在手机上添加到主屏幕 → 点击图标 → 观察是否加载预期页面,且无白屏或 404











