Personalizar o espaço de trabalho do IDX

O Project IDX permite que você personalize seu espaço de trabalho de acordo com as necessidades exclusivas do projeto, definindo um único arquivo de configuração .idx/dev.nix que descreve:

• As ferramentas do sistema que você precisa executar (por exemplo, no Terminal), como compiladores ou outros binários.
• As extensões do ambiente de desenvolvimento integrado que você precisa instalar (por exemplo, suporte a linguagem de programação).
• Como as visualizações do app vão aparecer (por exemplo, os comandos para executar o servidor da Web).
• Variáveis de ambiente globais disponíveis para servidores locais em execução no seu espaço de trabalho.

Consulte a referência dev.nix para uma descrição completa do que está disponível.

Nix e IDX

O IDX usa o Nix para definir a configuração do ambiente para cada espaço de trabalho. Especificamente, o IDX usa:

• A linguagem de programação Nix para descrever ambientes de espaço de trabalho. O Nix é uma linguagem de programação funcional. Os atributos e as bibliotecas de pacotes que você pode definir no arquivo dev.nix seguem a sintaxe do conjunto de atributos Nix.

• O gerenciador de pacotes Nix para gerenciar as ferramentas do sistema disponíveis no seu espaço de trabalho. Isso é semelhante a gerenciadores de pacotes específicos do SO, como APT (apt e apt-get), Homebrew (brew) e dpkg.

Como os ambientes Nix são reproduzíveis e declarativos, no contexto do IDX, isso significa que você pode compartilhar seu arquivo de configuração do Nix como parte do repositório Git para garantir que todos que trabalham no projeto tenham a mesma configuração de ambiente.

Um exemplo simples

O exemplo a seguir mostra uma configuração básica do ambiente que ativa as visualizações:

{ 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";
        # Optionally, specify a directory that contains your web app
        # cwd = "app/client";
      };
    };
  };
}

Adicionar ferramentas do sistema

Para adicionar ferramentas do sistema ao seu espaço de trabalho, como compiladores ou programas de CLI para serviços de nuvem, encontre o ID de pacote exclusivo no registro de pacotes do Nix e adicione-o ao objeto packages do arquivo dev.nix, com o prefixo "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
  ];
  ...
}

Isso é diferente de como você normalmente instala pacotes do sistema usando gerenciadores de pacotes específicos do SO, como APT (apt e apt-get), Homebrew (brew) e dpkg. A descrição declarativa de quais pacotes de sistema são necessários significa que os espaços de trabalho do IDX são mais fáceis de compartilhar e reproduzir.

Observação: a chave channel especifica qual canal de registro de pacotes Nix usar. É possível usar o canal unstable para usar as versões mais recentes dos pacotes, mas, como o nome do canal indica, isso pode impedir que o ambiente seja criado, dependendo de quando você iniciar o espaço de trabalho.

Usar binários de nó locais

Assim como na máquina local, os binários relacionados a pacotes de nó instalados localmente (ou seja, pacotes definidos no package.json) podem ser executados em um painel do Terminal, invocando-os com o comando npx.

Como conveniência adicional, se você estiver em um diretório com uma pasta node_modules, como o diretório raiz de um projeto da Web, os binários instalados localmente poderão ser invocados diretamente, sem o prefixo npx.

Adicionar componentes gcloud

Uma configuração padrão da CLI gcloud para Google Cloud está disponível para todos os espaços de trabalho IDX.

Se você precisar de outros componentes, adicione-os ao arquivo dev.nix desta forma:

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

Adicionar extensões de ambiente de desenvolvimento integrado

É possível instalar extensões no IDX usando o registro de extensão do OpenVSX de duas maneiras:

• Usando o painel Extensions no IDX para descobrir e instalar extensões. Essa abordagem é melhor para extensões específicas do usuário, como:

  • Temas de cores personalizados

• Adicionando extensões ao arquivo dev.nix. Essas extensões serão instaladas automaticamente quando você compartilhar a configuração do espaço de trabalho. Essa abordagem é melhor para extensões específicas do projeto, como:

  • Extensões de linguagem de programação, incluindo depuradores específicos de linguagem
  • Extensões oficiais para serviços de nuvem usados no seu projeto
  • Formatadores de código

Para a última abordagem, é possível incluir extensões do ambiente de desenvolvimento integrado no arquivo dev.nix encontrando o ID de extensão totalmente qualificado (do formulário <publisher>.<id>) e adicionando-o ao objeto idx.extensions da seguinte maneira:

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

Adicionar serviços comuns

O IDX também oferece configuração simplificada para serviços comuns que você pode precisar durante o desenvolvimento, incluindo:

• Contêineres
  • Docker (services.docker.*)
• Mensagens
  • Emulador do Pub/Sub (services.pubsub.*)
• Bancos de dados
  • MySQL (services.mysql.*)
  • Postgres (services.postgres.*)
  • Redis (services.redis.*)
  • Spanner (services.spanner.*)

Para saber como ativar esses serviços no seu espaço de trabalho, consulte as partes services.* da referência dev.nix.

Personalizar visualizações

Para saber como personalizar as visualizações do app, consulte a documentação de visualizações.

Definir o ícone do seu espaço de trabalho

Você pode escolher um ícone personalizado para seu espaço de trabalho colocando um arquivo PNG chamado icon.png ao lado do arquivo dev.nix, dentro do diretório .idx. O IDX usará esse ícone para representar seu espaço de trabalho no painel.

Como esse arquivo pode ser verificado no controle de origem (como o Git), essa é uma boa maneira de ajudar todos que trabalham no seu projeto a ver o mesmo ícone para o projeto ao usar o IDX. E como o arquivo pode variar entre as ramificações do Git, é possível até mesmo distinguir visualmente os espaços de trabalho ao trabalhar em versões "Beta" e "Produção" do app, por exemplo.

Transformar suas personalizações em um modelo

Para transformar a configuração do ambiente em um "ambiente inicial" para que qualquer pessoa possa criar novos projetos, consulte a documentação sobre como criar um modelo personalizado.

Conferir todas as opções de personalização

Consulte a referência dev.nix para uma descrição detalhada do esquema de configuração do ambiente.