自訂 IDX 工作區

Project IDX 可讓您根據專案的獨特需求，定義一個 .idx/dev.nix 設定檔來打造工作區，並描述以下內容：

需要能夠執行的系統工具 (例如從終端機執行)，例如編譯器或其他二進位檔。
需要安裝的 IDE 擴充功能 (例如程式設計語言支援)。
應用程式預覽顯示的方式 (例如執行網路伺服器的指令)。
全域環境變數可供工作區執行的本機伺服器使用。

如需可用功能的完整說明，請參閱 dev.nix 參考資料。

Nix 和 IDX

IDX 使用 Nix 定義各個工作區的環境設定。具體來說，IDX 使用：

Nix 程式設計語言來描述工作區環境。Nix 是一種功能性的程式設計語言。您可以在 dev.nix 檔案中定義的屬性和套件程式庫，遵循 Nix 屬性集語法。
Nix 套件管理工具可管理工作區可用的系統工具。這類似於 OS 專屬的套件管理工具，例如 APT (apt 和 apt-get)、Homebrew (brew) 和 dpkg。

由於 Nix 環境可重現及宣告，因此在 IDX 中，這表示您可以將 Nix 設定檔當做 Git 存放區的一部分來分享，藉此確保專案上每個人都有相同的環境設定。

基本示例

以下範例顯示啟用預覽的基本環境設定：

{ pkgs, ... }: {

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

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

  # 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";
      };
    };
  };
}

加入系統工具

如要在工作區中新增系統工具 (例如雲端服務適用的編譯器或 CLI 程式)，請在 Nix 套件登錄檔中尋找專屬套件 ID，然後將其新增至 dev.nix 檔案的 packages 物件，並在開頭加上 `pkgs：

{ pkgs, ... }: {
  # Which nixpkgs channel to use.
  channel = "stable-23.11"; # or "unstable"

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

這與使用 OS 專屬套件管理工具 (例如 APT (apt 和 apt-get)、Homebrew (brew) 和 dpkg) 安裝系統套件的方式不同。宣告需要哪些系統套件，讓 IDX 工作區更容易共用及重現。

使用本機節點二進位檔

和本機電腦一樣，與本機安裝的節點套件 (即 package.json 中定義的套件) 相關的二進位檔，可以使用 npx 指令叫用終端機面板中執行。

為了方便起見，如果您所在的目錄包含 node_modules 資料夾 (例如網路專案的根目錄)，則無需 npx 前置字串即可直接叫用本機安裝的二進位檔。

新增 `gcloud` 元件

Google Cloud 適用的 gcloud CLI 預設設定適用於所有 IDX 工作區。

如果需要其他元件，可以將其新增至 dev.nix 檔案，如下所示：

{ pkgs }: {
  packages = [
    ...
    (pkgs.google-cloud-sdk.withExtraComponents [
      pkgs.google-cloud-sdk.components.cloud-datastore-emulator
    ])
    ...
  ];
}

新增 IDE 擴充功能

您可以透過下列兩種方式使用 OpenVSX 擴充功能登錄檔，在 IDX 中安裝擴充功能：

使用 IDX 中的「Extensions」面板探索並安裝擴充功能。這個方法最適合使用者專屬的擴充功能，例如：
- 自訂色彩主題
在 dev.nix 檔案中新增擴充功能。共用工作區設定時，系統會自動安裝這些擴充功能。這種方法最適合專案專屬的擴充功能，例如：
- 程式設計語言擴充功能，包括特定語言適用的偵錯工具
- 專案中使用的雲端服務官方擴充功能
- 程式碼格式設定工具

若是第二種方法，您可以在 dev.nix 檔案中納入 IDE 擴充功能，方法是找出完整的擴充功能 ID (格式為 <publisher>.<id>)，然後將其新增至 idx.extensions 物件，如下所示：

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

新增常用服務

IDX 也針對開發期間可能需要的常見服務，提供經過簡化的設定和設定流程，包括：

容器
- Docker (services.docker.*)
訊息
- Pub/Sub 模擬器 (services.pubsub.*)
資料庫
- MySQL (services.mysql.*)
- Postgres (services.postgres.*)
- Redis (services.redis.*)
- Spanner (services.spanner.*)

如要進一步瞭解如何在工作區中啟用這些服務，請參閱 dev.nix 參考資料的 services.* 部分。

自訂預覽

如要進一步瞭解如何自訂應用程式預覽，請參閱預覽說明文件。

查看所有自訂選項

如需環境設定結構定義的詳細說明，請參閱 dev.nix 參考資料。