如何为代码实验室配置 Firebase SDK？

Question

据我所知，我已按照 FriendlyChat 应用程序 codelabs 教程中的每条说明进行操作。

我将点击控制台中的 Add firebase to your web app 图标生成的代码粘贴到索引页中。

但是，当我运行 firebase serve 并在 localhost:5000 加载页面时，我收到一条警告，告诉我我还没有配置和导入 Firebase SDK。

我该如何配置和导入 SDK？

Answer 1

您只需粘贴来自以下位置的初始化代码段： Firebase 控制台 > 概览 > 将 Firebase 添加到您的网络应用在 Web-start 文件夹中的 index.html 文件中。

Answer 2

我发现上面的答案有点不清楚，但设法用这种方法解决了它，以防对任何人有帮助：

转到 Firebase 主页
在右上角（您的个人资料图片旁边），您会发现'Go To Console' 点击它
在那里你会找到你的 'FriendlyChat' 项目，点击它
在左侧的 Firebase 图标下，您会找到一个齿轮图标（设置），转到那里
向下滚动，您会发现 window 与您的网络应用程序
有标题'SDK setup and configuration '
确保在 index.html 中包含 'automatic' 代码（如果您还没有的话）。它看起来类似于：

<script src="/__/firebase/8.6.3/firebase-app.js"></script>

<!-- TODO: Add SDKs for Firebase products that you want to use
     https://firebase.google.com/docs/web/setup#available-libraries -->
<script src="/__/firebase/8.6.3/firebase-analytics.js"></script>

<script src="/__/firebase/init.js"></script>

确保在 index.html 中包含 'CDN' 代码（如果您还没有）（请记住将其放在任何 firebase 脚本调用之前）。它看起来像这样：

<script src="https://www.gstatic.com/firebasejs/8.6.3/firebase-app.js"></script>

<!-- TODO: Add SDKs for Firebase products that you want to use
     https://firebase.google.com/docs/web/setup#available-libraries -->
<script src="https://www.gstatic.com/firebasejs/8.6.3/firebase-analytics.js"></script>

<script>
  // Your web app's Firebase configuration
  // For Firebase JS SDK v7.20.0 and later, measurementId is optional
  var firebaseConfig = {
    apiKey: "...",
    authDomain: "...",
    projectId: "...",
    storageBucket: "...",
    messagingSenderId: "...",
    appId: "...",
    measurementId: "..."
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();
</script>

注意：如果您不包括分析，我想您不应该包括分析脚本（只需复制并粘贴网站上提供给您的代码）

这使警报不再为我显示。

如何为代码实验室配置 Firebase SDK？

How do I configure the Firebase SDK for the codelab?

cmd

web

firebase

firebase-hosting