iOS端点击“Add to Home Screen”添加PWA到主屏幕时Safari跳转assets文件夹致路由失效

该问题本质是iOS Safari对PWA独立模式的路径解析规则与浏览器内打开不一致导致的，当manifest配置、站点基础路径与路由模式不匹配时，就会出现PWA启动时路径指向assets目录、路由匹配失效的问题。

修复步骤 #

• 修正manifest.json配置
  确保配置中的start_url与scope字段指向站点的根路径，和你实际的部署路径保持一致，示例配置：

  {
    "start_url": "/",
    "scope": "/",
    // 其余manifest配置保持不变
  }
  

  同时确保manifest文件是在站点根路径被加载，而非assets目录下加载，可在Safari网络请求面板确认manifest的请求地址。

• 对齐前端构建的基础路径配置
  前端构建工具的基础路径（Vite对应base配置项，Webpack对应publicPath配置项）必须和start_url完全一致，禁止设置为相对路径./，相对路径会导致PWA启动时以manifest所在的assets文件夹路径作为基础路径解析后续所有路由，直接触发路由失效问题。

• 适配路由模式
  如果你使用的是history路由模式，必须在服务端配置所有路由路径 fallback 到index.html的规则，避免iOS PWA跳转路由时直接请求服务端对应路径返回404；如果暂时无法调整服务端配置，可以临时切换为hash路由模式规避该问题。

内容的提问来源于stack exchange，提问作者Stan