Firebase Studio 工作区简介

Firebase Studio 提供基于云端的协作开发环境,可通过广泛组合的框架和库简化应用构建流程。

设置 Firebase Studio 工作区后,您就可以访问和共享功能齐全、灵活的开发环境:Firebase Studio 工作区可从任何设备访问,并提供集成工具,可简化您和团队的开发流程。

创建工作区

Firebase Studio 中的 Workspace 是一个开发环境,其中包含开发应用所需的一切。它包含您的代码、代码编辑器(包含与您的项目相关的插件)以及支持应用开发的工具链。这就像在本地桌面开发环境中创建新项目一样,只不过您有一部预配置的整套计算机和操作系统,专门用于专门构建应用,并在云端的浏览器中运行,您可以随时随地访问。

Firebase Studio 工作区经过优化,可包含单个代码库,以便您将不同应用的环境和系统级依赖项彼此隔离。您可以创建多个工作区,以便与不同的应用和框架搭配使用。

要创建新工作区,请按以下步骤操作:

配置工作区

Firebase Studio 使用 Nix 为每个工作区定义环境配置。Nix 是一个纯粹的功能型软件包管理器,会为每个依赖项分配唯一标识符,这最终意味着您的环境可以无缝地包含同一依赖项的多个版本。它还具有可重复性和声明性。在 Firebase Studio 上下文中,这意味着您可以在工作区之间共享 Nix 配置文件,以加载相同的环境配置。详细了解 Nix + Firebase Studio

创建或修改 .idx/dev.nix 文件

环境配置在代码库的 .idx/dev.nix 文件中定义。此文件指定要添加到工作区的所有组件,包括:

如需查看用于在 Firebase Studio 中启用应用预览的基本工作区环境配置,请参阅以下 .idx/dev.nix 文件示例:

{ pkgs, ... }: {

  # Which nixpkgs channel to use.
  channel = "stable-23.11"; # or "unstable"

  # Use https://search.nixos.org/packages to find packages
  packages = [
    pkgs.nodejs_20
  ];

  # Sets environment variables in the workspace
  env = {
    SOME_ENV_VAR = "hello";
  };

  # Search for the extensions you want on https://open-vsx.org/ and use "publisher.id"
  idx.extensions = [
    "angular.ng-template"
  ];

  # Enable previews and customize configuration
  idx.previews = {
    enable = true;
    previews = {
      web = {
        command = [
          "npm"
          "run"
          "start"
          "--"
          "--port"
          "$PORT"
          "--host"
          "0.0.0.0"
          "--disable-host-check"
        ];
        manager = "web";
        # Optionally, specify a directory that contains your web app
        # cwd = "app/client";
      };
    };
  };
}

应用新配置

每次添加或更新 dev.nix 配置文件时,Firebase Studio 都会在右下角显示一条提示,提示您重新构建环境。重新构建环境所需的时间取决于您的配置所需的软件包数量。

调试环境构建失败

由于配置文件是机器可读的代码,因此可能会有错误。如果发生这种情况,环境可能无法构建和启动。Firebase Studio 会显示用于启动恢复环境的选项。此工作区不包含您定义的任何配置,只会运行基本 Code OSS。这样,您就可以修复 dev.nix 配置文件中的错误并重新构建环境。

后续步骤