在 Firebase Studio 中试用 Gemini in Firebase

Firebase Studio设置 Gemini in Firebase 后,您可以立即开始使用它来:

请注意,内嵌代码补全和代码库编制索引功能默认处于开启状态。了解如何调整其设置

Firebase 中与 Gemini 聊天

Firebase Studio 通过 AI 辅助聊天功能简化开发工作流。

Chat 使用入门

  1. Firebase Studio 中打开工作区。

  2. 点击工作区底部的火花图标 Gemini

  3. 开始与 Gemini 聊天。

  4. (可选)点击 “附加”图标 Attach(附加),然后选择以下选项之一,将多模式提示发送给 Gemini

    • 绘图:使用绘图工具设计您想要的设计,然后输入提示并点击发送
    • 图片:上传图片,添加问题,然后点击发送
    • 文件:从工作区中选择要用作上下文的文件,添加问题,然后点击发送
  5. (可选)添加您自己的 Gemini API 键,然后选择其他 Gemini 模型。如需了解详情,请参阅自带密钥:在聊天中使用其他 Gemini 模型

  6. (可选)通过调整其设置和添加 AI 规则文件,自定义 Firebase 中的 Gemini 为您提供的帮助方式。了解详情

聊天功能启用并处于活跃状态后,您可以提出 Gemini 问题并获取代码建议。Gemini 甚至可以直接在您的工作区内更新项目配置文件和代码,并为您运行终端命令。Gemini 可能会询问是否可以执行以下任一操作:

  • 修改文件Gemini 可以添加功能、修复 bug 或重构代码。当 Gemini 提出对文件的更改建议时,您会看到以下两个选项:
    • 更新文件:直接使用 Gemini 建议的更改更新文件。
    • 查看更改:在应用更改之前,请在另一个窗口中打开建议的更改进行查看。
  • 运行终端命令Gemini 可以运行安装依赖项或启动开发服务器等命令。它可能会自行提出这些命令,或者您也可以要求 Gemini 运行这些命令。Gemini 建议命令后,系统会显示运行终端命令按钮。点击该按钮可在 Firebase Studio 的终端中执行命令。Gemini 会在聊天窗口中运行该命令并为您解读结果,还会帮助您确定后续步骤。

    注意:对于长时间运行的命令(例如,使用 npm run dev 运行服务器),系统会显示分离按钮。点击分离,让命令在终端中继续运行,同时重新获得聊天访问权限。

通过聊天完成复杂任务

Firebase 中的 Gemini 可以帮助您完成复杂的开发任务,例如:

  • 为代码编写文档:当您要求 Gemini“Write my docs”(编写文档)时,它可以自动为您的代码生成适当格式的文档。
  • 编写测试用例Gemini 可以自动更新和生成单元测试。如果您要求 Gemini“编写我的测试”,Gemini 会找到现有的单元测试文件,并可以将缺少的测试添加到该文件中。如果它找不到现有的单元测试文件,则会创建单元测试供您查看、迭代和接受,您甚至可以让 Gemini 运行它!
  • 管理依赖项:您可以让 Gemini 检测代码中缺少的依赖项,并直接在聊天界面中解决这些问题。
  • 重构代码:您可以让 Gemini 代表您重构代码,例如提取函数或重命名多个文件中的变量。Gemini 会生成建议的更改列表,在查看并应用更改后,您可以要求 Gemini 更新和执行单元测试,以验证重构并确保测试继续通过。
  • 生成和运行 Docker 工作流:如果您已在工作区中启用 Docker,则可以通过让 Gemini 创建 Dockerfile(例如“为我的应用创建 Dockerfile”)来快速容器化应用。Gemini 生成 Dockerfile 后,它可以为您构建和运行容器。
  • 运行单元测试和集成测试:您可以通过请求 Gemini 运行特定测试套件(例如“运行我的单元测试”或“运行集成测试”)来启动测试执行。Gemini 将为您的项目执行适当的命令(例如 npm test 或特定的测试运行器命令),并在聊天界面中显示测试结果。

在聊天中使用斜杠命令

您可以使用斜线命令(以正斜线 [/] 开头的快捷键)来引导 Firebase 聊天中 Gemini 提供的输出。在 Gemini 聊天提示开头输入 /,然后从可用斜线命令列表中选择所需操作。

如需查看斜线命令的完整列表,请在聊天中输入 /

例如,/generate 后跟您想要的功能的简短说明,就是用于生成代码段的提示快捷方式。

以下是运行 /generate css for a black background 的返回值示例:

body {
  background-color: black;
}

/* This CSS code sets the background color of the <body> element to black. This will make the background of the entire web page black. */

管理聊天记录

你可以在 Firebase 聊天中发起不同的会话,以便将不同的主题分开。然后,您可以根据主题查看之前的会话。

如要发起新对话,请执行以下操作:

  1. 点击聊天标题栏中的发起新对话

  2. 输入你的提示。

如需切换到其他聊天会话,请执行以下操作:

  1. 点击 Chat 标题栏中的近期对话

  2. 选择您要访问的对话会话。

  3. 使用 Gemini 继续该聊天会话或查看之前的对话。

如需删除对话会话,请执行以下操作:

  1. 在聊天标题栏中的近期对话中,选择要删除的对话会话。

  2. 点击聊天标题栏中的删除对话。确认您要从聊天记录中删除聊天会话。

在聊天中查看代码引用

为帮助您验证代码建议,Firebase Studio 会分享有关原始来源和关联许可的信息。您可以点击聊天标题栏中的“许可日志”图标,在聊天窗口中查看完整的代码引用日志。

聊天标题栏中的许可日志图标

如需详细了解 Google 代码引用,请参阅生成式代码协助

Firebase 中获取 Gemini 提供的内嵌帮助

Firebase Studio 可通过 Gemini 提供的 AI 辅助代码建议来提高工作效率。

请注意,代码补全功能默认处于开启状态。了解如何调整其设置

Firebase 中获取 Gemini 提供的代码建议

Gemini 会在内嵌位置生成可能的完整代码块。如需使用 Gemini 内嵌代码协助功能,请按以下步骤操作:

  1. Firebase Studio 中打开工作区。

  2. 前往您需要帮助的文件或代码行,然后按 Ctrl+I(在 MacOS 上按 Cmd+I)。

  3. 输入您想要的内容的说明,Gemini 就会生成建议。您还可以将操作用作快捷方式来引导建议。例如,输入 /fixError 可帮助修正内嵌代码中的错误。

  4. 选择执行以下任一操作:

    • 如要保留生成的代码,请点击接受
    • 如需将建议粘贴到其他位置或移至新文件,请从舍弃按钮对应的下拉菜单中选择相应选项。
    • 如需生成新的建议,请点击重新生成
    • 如需彻底移除建议,请点击舍弃
  5. (可选)通过调整其设置和添加 AI 规则文件,自定义 Firebase 中的 Gemini 为您提供的帮助方式。了解详情

Firebase 命令中内嵌查看 Gemini

  1. 如需查看特定代码的内嵌 Gemini 命令,请选择要获取帮助的代码并右键点击该代码。

  2. 从菜单中选择 spark 图标 Gemini,然后选择要执行的操作。

使用 Gemini 建议的代码补全功能

为了帮助您编写代码,Firebase Studio 提供了 AI 代码补全功能,可在您开始输入时,在任何打开的文件中预测和自动填充代码。

请注意,代码补全功能默认处于开启状态

如需开启或关闭代码补全功能,请使用以下方法之一调整代码补全设置:

  • 如果您使用的是 settings.json 文件,请将 "IDX.aI.enableInlineCompletion" 设置为 truefalse

  • 如需更新 Firebase Studio 工作区中的设置,请执行以下操作:

    1. 点击 齿轮图标 管理(位于工作区的左下角),然后选择“设置”,或按 Ctrl+,(在 Mac 上为 Cmd+,)。

      如果您在 Prototyper view, click Code switch icon Switch to Code to open Code view. 中使用 App Prototyping agent

    2. 选择 Workspace(工作区)标签页,然后依次选择 Firebase Studio > AI > 启用内嵌补全设置。

    3. 如需关闭代码补全功能,请取消选中在您输入时启用内嵌代码补全选项。