如何在 Firebase 控制台上部署 ionic 4 应用程序？

Posted 2023-03-07

【中文标题】如何在 Firebase 控制台上部署 ionic 4 应用程序？

【英文标题】：How to deploy ionic 4 app on firebase console?

【发布时间】：2019-07-08 20:31:49

【问题描述】：

无法在 firebase 控制台上部署我的实际 ionic 应用程序。

我执行的步骤：-

创建一个新的 ionic 项目 firebase 初始化 -firebase 部署

但我无法查看离子输出

另外，附上 CMD 截图和部署屏幕

【问题讨论】：

遵循本指南 - 非常适合您的需求：joshmorony.com/hosting-an-ionic-pwa-with-firebase-hosting

答案：1. ionic build 2. Firebase init（给出以下答案）-您准备好继续了吗？是的 - 你想用什么作为你的公共目录？ www - 配置为单页应用程序（将所有 url 重写为 /index.html）？是 - 文件 www/index.html 已经存在。覆盖？没有 3. firebase 部署

【参考方案1】：

您需要构建项目。我通常会这样做

ionic cordova build browser 或ionic build

此命令创建一个 www 目录，Firebase 所需的所有文件都位于该目录中。您应该验证 firebase.json 的公共属性是否设置为该文件夹。

然后你做'firebase deploy'

希望对你有帮助！

【讨论】：

正确答案ikerllo

是的，这对我有用，我在文档中没有看到它。将“公共”更改为“www”

【参考方案2】：

从下面给出的 URL 中找出您的答案并按原样执行步骤

网址： https://www.djamware.com/post/5b74e54f80aca74669894413/ionic-4-and-angular-6-tutorial-firebase-realtime-crud-mobile-app#ch-1

【讨论】：

预期答案，一步一步解决。谢谢帕林

【参考方案3】：

(Inside ionic project)
PS E:\PROJECT\Project Angular\business-card-user - Copy> ionic build
> ng run app:build

Date: 2019-02-15T11:14:09.815Z
Hash: 19b812988985c5c367ab
Time: 32819ms
.
.
.
   DONE

PS E:\PROJECT\Project Angular\business-card-user - Copy> firebase init

     ######## #### ########  ######## ########     ###     ######  ########
     ##        ##  ##     ## ##       ##     ##  ##   ##  ##       ##
     ######    ##  ########  ######   ########  #########  ######  ######
     ##        ##  ##    ##  ##       ##     ## ##     ##       ## ##
     ##       #### ##     ## ######## ########  ##     ##  ######  ########

You're about to initialize a Firebase project in this directory:

  E:\PROJECT\Project Angular\business-card-user - Copy

Before we get started, keep in mind:

  * You are initializing in an existing Firebase project directory

? Are you ready to proceed? Yes
? Which Firebase CLI features do you want to setup for this folder? Press Space to select features, then Enter to confirm your choices. Ho
sting: Configure and deploy Firebase Hosting sites

=== Project Setup

First, let's associate this project directory with a Firebase project.
You can create multiple project aliases by running firebase use --add,
but for now we'll just set up a default project.

i  .firebaserc already has a default project, skipping

=== Hosting Setup

Your public directory is the folder (relative to your project directory) that
will contain Hosting assets to be uploaded with firebase deploy. If you
have a build process for your assets, use your build's output directory.

? What do you want to use as your public directory? www
? Configure as a single-page app (rewrite all urls to /index.html)? Yes
? File www/index.html already exists. Overwrite? No
i  Skipping write of www/index.html

i  Writing configuration info to firebase.json...
i  Writing project information to .firebaserc...

+  Firebase initialization complete!
PS E:\PROJECT\Project Angular\business-card-user - Copy> firebase deploy

=== Deploying to 'digitalvcard-user'...

i  deploying hosting
i  hosting[digitalvcard-user]: beginning deploy...
i  hosting[digitalvcard-user]: found 1061 files in www
+  hosting[digitalvcard-user]: file upload complete
i  hosting[digitalvcard-user]: finalizing version...
+  hosting[digitalvcard-user]: version finalized
i  hosting[digitalvcard-user]: releasing new version...
+  hosting[digitalvcard-user]: release complete

+  Deploy complete!

Project Console: https://console.firebase.google.com/........
Hosting URL: https://digitalvcard-user.firebaseapp.com

【参考方案4】：

你部署的是> Firebase init创建的内容 您需要从您的 ionic 应用上传内容，因此您需要运行以下命令

> ionic build

等到它出现成功消息。

> Firebase deploy. 

希望这会有所帮助。