如何将 React App 添加到 Firebase 托管项目

【问题标题】：How to add React App to a Firebase Hosting project如何将 React App 添加到 Firebase 托管项目
【发布时间】：2020-08-21 05:37:10
【问题描述】：

我使用 Firebase Functions/Hosting 创建了一个简单的 CRUD RESTful API。

现在我想使用 React 构建相应的前端来查询我的 API。

但是，我不知道如何干净地将新的 React 应用添加到我的项目文件夹并将其部署到 Firebase 托管。

这是我目前的文件夹结构： https://imgur.com/a/WwDxji7

整个 API 位于函数文件夹中的“index.ts”中。（我知道，将所有内容都放在一个文件中并不好）。

在哪里/如何添加 React 应用并将其部署到 Hosting？

【问题讨论】：

【解决方案1】：

您使用 Cloud Functions 的 API 是一个单独的项目，而您的前端应用程序是一个单独的项目。您可以将两个项目分开或放在同一个文件夹中，这是您个人的选择。

话虽如此，firebase-tools 将云功能项目安装在functions 文件夹中，这样您的主要前端项目就可以作为父文件夹驻留。 Firebase 在父文件夹中几乎没有文件来存储 Firebase 设置，这些设置通常不会干扰您的前端应用程序。

对于部署，您可以在同一主机或不同主机中部署 API 和前端应用程序，再次选择是您的。如果您部署在同一个 Firebase 主机上，您可以在 firebase.json 中设置规则来区分您的函数和应用程序的路由。

【讨论】：