使用Firebase托管部署Quasar

Question

我在将类星项目部署到Firebase时遇到问题。它说部署成功，但是两个小时后，这就是网页上显示的内容。

firebase.json

"hosting": {
   "public": "dist/spa",
   "ignore": [
     "firebase.json",
     "**/.*",
     "**/node_modules/**"
   ],
   "rewrites": [
     {
       "source": "**",
       "destination": "/index.html"
     }
   ]

routes.js

const routes = [
  {
    path: '/',
    component: () => import('layouts/MainLayout.vue'),
    children: [
      { path: '', component: () => import('pages/PageUsers.vue') },
      { path: '/chat/:otherUserId', component: () => import('pages/PageChat.vue') },
      { path: '/auth', component: () => import('pages/AuthPage.vue') }

    ]
  },

  // Always leave this as last one,
  // but you can also remove it
  {
    path: '*',
    component: () => import('pages/Error404.vue')
  }
]

export default routes

我首先运行类星体构建，然后运行firebase初始化，然后部署firebase，但该站点上尚未显示任何内容。为什么会发生这种情况的任何想法？

更新：现在，同一页面显示在http：// localhost：8080 /上，而不是我的项目上

Answer 1

如果您先构建，“ firebase初始化”将覆盖index.html。

1. Firebase初始化
2. 运行类星体构建
3. Firebase部署

您按此顺序尝试过吗？

我也遇到了同样的问题，但是，当我更改订单后，它照常工作。

Answer 2

我在使用 Firebase 托管设置 Quasar 项目时遇到了同样的问题。 我注意到的一件事是在 index.html 文件夹内的 firebase init 期间生成了一个新的 public。 删除public/index.html后，原索引页显示正常。

解决方案：

• 检查 index.html 文件夹中是否生成了 public 文件
• 删除文件

Answer 3

这是因为 Firebase 正在用它自己的 index.html 覆盖您的 index.html，以解决这个问题：

1. 运行 quasar build -spa 以生成正确的 index.html

2. 运行 firebase init 并且当它要求您覆盖 index.html 时选择“否”，如下所示：

3. 运行firebase deploy