如何使用 vue.js 和 firebase（目录结构）

Question

安装 firebase 时，会自动创建 'public' 文件夹和 'index.html'。我不确定在当前的 vue 项目文件结构中将 'public' 文件夹放在哪里。 'localhost: 8080' 屏幕显示正确，但使用 firebase 托管的屏幕未显示。

这个路径是一个Vue项目。 C:\Users\username\public\vue-project

此路径是 Firebase 的 'public' 文件夹。 C:\Users\username\public

然后我在cmd里运行'firebase deploy'

cd C:\Users\username>firebase 部署
cd C:\Users\username\public>firebase 部署

Answer 1

如果正如您在上面的评论中提到的那样，您仍然看到默认的 Firebase "Welcome" 页面，这意味着您可能没有正确覆盖它。

您应该将 vue.js dist 文件夹（通过 npm run build 生成）的全部内容放入 Firebase 托管的 public 文件夹（并覆盖默认 index.html 最初由 Firebase 项目设置脚本生成的文件）。

然后在您的 firebase.json 文件中进行以下重写，以处理您 vue.js 应用程序的单页应用程序行为。

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

如何使用 vue.js 和 firebase（目录结构）

How to use vue.js and firebase (directory-structure)

firebase

vue.js

directory

directory-structure