自定义 IDX 工作区

借助 Project IDX，您可以根据项目的独特需求定制工作区 方法是定义一个 .idx/dev.nix 配置文件，描述以下内容：

  • 您需要能够运行的系统工具（例如，从 终端），例如编译器或其他二进制文件。
  • 您需要安装的 IDE 扩展程序（例如，编程语言 支持）。
  • 应用预览应如何显示（ 例如用于运行网络服务器的命令）。
  • 全局环境变量可用于在您的 工作区。

如需查看完整的信息，请参阅 dev.nix 参考文档 对可用内容的说明

Nix 和 IDX

IDX 使用 Nix 来定义 每个工作区的环境配置。具体而言，IDX 使用：

  • Nix 编程语言 描述工作区环境。Nix 是一种函数式编程语言。 您可以在 dev.nix 文件中定义的属性和软件包库 遵循 Nix 属性集 语法。

  • Nix 软件包管理器： 可用的系统工具这类似于 软件包管理器，例如 APT（apt 和 apt-get）、Homebrew (brew) 以及 dpkg。

由于 Nix 环境是可重现的声明式环境， IDX，这表示您可以在 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";
      };
    };
  };
}

添加系统工具

向工作区添加系统工具，例如 云服务，请在 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）、HomeBra (brew) 和 dpkg。以声明方式准确描述哪些系统软件包 意味着 IDX 工作区更易于共享和复制。

使用本地节点二进制文件

就像在本地机器上一样，与本地安装的节点相关的二进制文件 软件包（即 package.json 中定义的软件包）可以在 使用 npx 调用“终端”面板 命令。

为额外便利，如果您所在的目录包含 node_modules 文件夹（例如 Web 项目的根目录），本地安装的二进制文件 无需 npx 前缀即可直接调用。

添加 gcloud 组件

适用于 Google 的 gcloud CLI 的默认配置 Cloud 面向所有 IDX 提供 工作区。

如果您需要其他组件，可以将其添加到 dev.nix 文件中，例如 所以：

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

添加 IDE 扩展程序

您可以使用 OpenVSX 扩展程序注册表：

  • 使用 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 还简化了您常用服务的设置和配置 包括：

  • 容器 <ph type="x-smartling-placeholder">
      </ph>
    • Docker (services.docker.*)
  • 消息功能 <ph type="x-smartling-placeholder">
      </ph>
    • Pub/Sub 模拟器 (services.pubsub.*)
  • 数据库 <ph type="x-smartling-placeholder">
      </ph>
    • MySQL (services.mysql.*)
    • Postgres (services.postgres.*)
    • Redis (services.redis.*)
    • Spanner (services.spanner.*)

如需详细了解如何在工作区中启用这些服务，请参阅services.* dev.nix 参考中的相关部分。

自定义预览

有关如何自定义应用预览的详情，请参阅 预览。

设置您的工作区图标

您可以为工作区选择自定义图标，只需将名为 icon.png（位于 .idx 目录内 dev.nix 文件旁边）。IDX 随后会使用此图标在信息中心内表示您的工作区。

由于该文件可以签入源代码控制（如 Git）中， 这样做的好方法，可以让参与您项目的每个人看到同一应用的图标， 项目。由于文件可能因 Git 分支而异 您甚至可以在处理“Beta 版”时直观地区分各个工作区和 “production”等不同版本

将自定义设置转换为模板

将您的环境配置转换为“起始环境”任何人 用于构建新项目，请参阅有关如何创建自定义 模板。

查看所有自定义选项

如需详细了解，请参阅 dev.nix 参考文档 环境配置架构的说明。