關於 Firebase Studio 工作區

Firebase Studio 提供合作的雲端式開發環境,可透過廣泛的架構和程式庫組合,簡化應用程式建構程序。

設定 Firebase Studio 工作區後,您就能存取及分享功能完整且靈活的開發環境:Firebase Studio 工作區可透過任何裝置存取,並提供整合式工具,讓您和團隊的開發程序更有效率。

建立工作區

Firebase Studio 中的工作區是開發環境,其中包含開發應用程式所需的一切工具。其中包含程式碼、程式碼編輯器 (含與專案相關的外掛程式),以及支援應用程式開發的工具鍊。這就像在本機電腦開發環境中建立新專案一樣,只是整部電腦和作業系統都已預先設定,且專門用於建構應用程式,並在雲端的瀏覽器中執行,讓您隨時隨地存取。

Firebase Studio 工作區經過最佳化,可包含單一程式碼集,讓您將不同應用程式的環境和系統層級依附元件彼此隔離。您可以建立多個工作區,用於搭配不同應用程式和架構使用。

如要建立新工作區,請按照下列步驟操作:

設定工作區

Firebase Studio 會使用 Nix 定義每個工作區的環境設定。Nix 是純粹的功能性套件管理工具,可為每個依附元件指派專屬 ID,這最終代表您的環境可無縫地包含同一個依附元件的多個版本。這項功能也能重現,且具備宣告式功能。在 Firebase Studio 的情況下,這表示您可以在工作區之間共用 Nix 設定檔,以便載入相同的環境設定。進一步瞭解 Nix + Firebase Studio

建立或編輯 .idx/dev.nix 檔案

環境設定是在程式碼存放區的 .idx/dev.nix 檔案中定義。這個檔案會指定要新增至工作區的所有元件,包括:

請參閱以下 .idx/dev.nix 檔案範例,瞭解如何在 Firebase Studio 中啟用應用程式預覽功能的基本工作區環境設定:

{ 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 設定檔中的錯誤,並重新建構環境。

後續步驟