自定义 IDX 工作区

借助 Project IDX,您可以通过定义一个描述以下各项的 .idx/dev.nix 配置文件来根据项目的独特需求定制工作区:

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

有关可用内容的完整说明,请参阅 dev.nix 参考文档

Nix 和 IDX

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

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

  • Nix 软件包管理器:用于管理适用于工作区的系统工具。这与操作系统专用的软件包管理器,如 APT(aptapt-get)、HomeBra (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
  ];
  ...
}

这与您通常使用操作系统专用软件包管理器(如 APT(aptapt-get)、HomeBra (brew) 和 dpkg)安装系统软件包的方式不同。以声明方式准确描述需要哪些系统软件包,意味着 IDX 工作区更易于共享和重现。

使用本地节点二进制文件

就像在本地机器上一样,与本地安装的节点软件包(即 package.json 中定义的软件包)相关的二进制文件可以在终端面板中执行,方法是使用 npx 命令调用这些软件包。

为额外便利,如果您位于包含 node_modules 文件夹的目录(例如 Web 项目的根目录)中,则可以直接调用本地安装的二进制文件,而无需使用 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 参考文档