PWA的路由器部分在设备上打开空白（带有Vue）

Question

我基于Vue构建了2个PWA（具有Vue UI模板，已经设置了路由器和PWA），但是我遇到了两个相同的问题：在设备上添加到主屏幕后，从应用程序图标打开它时，路由器会直到我单击路由器链接后才显示并保持空白。我不明白为什么。

我的投资组合之一，例如：

URL 链接

GitHub 链接

我认为文件中与该问题有关的某些部分：

router.js：

export default new Router({
  mode: 'history',
  base: 'index.html',
  routes: [
    {
      path: '/',
      name: 'home',
      component: Home
    }
  ]
})

firebase.json：

"rewrites": [
  {
    "source": "**",
    "destination": "/index.html"
  }
]

Answer 1

有同样的问题。事实证明，该解决方案非常简单。您必须在 manifest.json 中添加/更改它

"start_url": "/",
"scope": "/"

Answer 2

我解决了在路由起始页中添加别名的问题（在我的情况下为“登录”）

在manifest.json中：

{
...
"start_url": "index.html",
...
}

在路由器配置中：

let router = new Router({
...
  routes: [
    {   path: '/index.html',
        component: Login,
        alias: '/'
    },
    {
        path: '/',
        name: 'login',
        component: Login
    },
...