プロジェクト IDX はベータ版です。ベータ版のプロダクトや機能では、サポートが制限されることがあります。また、ベータ版のプロダクトや機能の変更は、以前のバージョンと互換性がない可能性があります。

このページは Cloud Translation API によって翻訳されました。

IDX ワークスペースのカスタマイズ

プロジェクト IDX では、以下を記述した単一の .idx/dev.nix 構成ファイルを定義することにより、プロジェクト固有のニーズに合わせてワークスペースを調整できます。

コンパイラやその他のバイナリなど、（ターミナルなどから）実行する必要があるシステムツール。
インストールする必要がある IDE 拡張機能（プログラミング言語サポートなど）。
アプリのプレビューの表示方法（ウェブサーバーを実行するコマンドなど）。
ワークスペースで実行されているローカルサーバーで使用できるグローバル環境変数。

利用可能な機能の詳細については、dev.nix リファレンスをご覧ください。

Nix、IDX

IDX は Nix を使用して各ワークスペースの環境構成を定義します。具体的には、IDX は次のものを使用します。

ワークスペース環境を記述する Nix プログラミング言語。Nix は関数型プログラミング言語です。dev.nix ファイルで定義できる属性とパッケージライブラリは、Nix 属性セットの構文に従います。
ワークスペースで利用可能なシステムツールを管理するための Nix パッケージマネージャー。これは、APT（apt と apt-get）、Homebird（brew）、dpkg などの OS 固有のパッケージ管理システムに似ています。

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
  ];
  ...
}

これは、APT（apt と apt-get）、Homebird（brew）、dpkg などの OS 固有のパッケージ管理システムを使用してシステムパッケージをインストールする通常の方法とは異なります。必要なシステムパッケージを正確に宣言することで、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 拡張機能レジストリを使用して、次の 2 つの方法で IDX に拡張機能をインストールできます。

IDX の [Extensions] パネルを使用して、拡張機能を検出してインストールする。この方法は、次のようなユーザー固有の拡張機能に最適です。
- カスタムカラーテーマ
dev.nix ファイルに拡張機能を追加する。これらの拡張機能は、ワークスペースの構成を共有すると自動的にインストールされます。この方法は、次のようなプロジェクト固有の拡張機能に最適です。
- プログラミング言語の拡張機能（言語固有のデバッガを含む）
- プロジェクトで使用されるクラウドサービスの正式な拡張機能
- コードフォーマッタ

後者の方法では、次のように完全修飾された拡張機能 ID（<publisher>.<id> の形式）を見つけて idx.extensions オブジェクトに追加することで、dev.nix ファイルに IDE 拡張機能を含めることができます。

{ 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 リファレンスをご覧ください。