IDX çalışma alanınızı özelleştirme

Project IDX, çalışma alanınızı projenizin benzersiz ihtiyaçlarına göre uyarlamanızı sağlar Şunları açıklayan tek bir .idx/dev.nix yapılandırma dosyası tanımlayarak:

  • Çalıştırmanız gereken sistem araçları (örneğin, Terminal) kullandığınızdan emin olun.
  • Yüklü olması gereken IDE uzantıları (örneğin, programlama dili) destek).
  • Uygulama önizlemeleriniz nasıl görünmelidir? ( web sunucunuzu çalıştırmak için kullanılan komutlar).
  • çalışmayacaktır.

Eksiksiz bilgi için dev.nix referansına bakın açıklamaya yardımcı olur.

Nix ve IDX

IDX, şu verileri tanımlamak için Nix'i kullanır: ortam yapılandırmasını değiştirebilirsiniz. IDX özellikle şunları kullanır:

Çünkü Nix ortamları şu bağlamda tekrarlanabilir ve bildirimseldir: IDX demektir. Bu, Nix yapılandırma dosyanızı Projenizde çalışan herkesin aynı bilgilere sahip olmasını sağlamak için Git deposu yapılandırmalısınız.

Temel bir örnek

Aşağıdaki örnekte, önizlemeleri etkinleştiren temel bir ortam yapılandırması gösterilmektedir:

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

Sistem araçları ekleyin

Çalışma alanınıza derleyiciler veya CLI programları gibi sistem araçları eklemek için: Nix paketinde benzersiz paket kimliğini bulun. kayıt defterine kaydedin ve dev.nix dosyanızın "pkgs" ile başlayan packages nesnesi:

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

Bu, sistem paketlerini normal şartlarda APT (apt ve apt-get), Homebrew gibi işletim sistemine özel paket yöneticileri (brew) ve dpkg. Tam olarak hangi sistem paketlerinin sunulduğunu açıklayarak tanımlama gerekli olduğunda IDX çalışma alanlarının paylaşılması ve yeniden oluşturulması daha kolaydır.

Yerel düğüm ikili programlarını kullan

Yerel makinenizde olduğu gibi, yerel olarak yüklenmiş düğümle ilgili ikili programlar da paketler (package.json içinde tanımlanan paketler) Terminal panelini npx ile çağırarak komutu.

Ek kolaylık olarak, node_modules içeren bir dizindeyseniz klasör (bir web projesinin kök dizini gibi), yerel olarak yüklenmiş ikili programlar npx öneki olmadan doğrudan çağrılabilir.

gcloud bileşen ekle

Google için gcloud KSA'nın varsayılan yapılandırması Cloud, tüm IDX'ler tarafından kullanılabilir çalışma alanları.

Ek bileşenlere ihtiyacınız olursa bunları dev.nix dosyanıza ekleyebilirsiniz. Örneğin: dolayısıyla:

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

IDE uzantıları ekleme

IDX'teki uzantıları şu dosyayı kullanarak yükleyebilirsiniz: OpenVSX uzantı kayıt defterini iki şekilde kullanabilirsiniz:

  • Keşif ve yükleme yapmak için IDX'te Uzantılar panelini kullanarak uzantılar. Bu yaklaşım, aşağıdakiler gibi kullanıcıya özel uzantılar için en iyi seçenektir:

    • Özel renk temaları

  • dev.nix dosyanıza uzantı ekleyerek. Bu uzantılar çalışma alanı yapılandırmanızı paylaştığınızda otomatik olarak yüklenir. Bu yaklaşım, aşağıdakiler gibi projeye özgü uzantılar için en iyisidir:

    • Dile özgü hata ayıklayıcılar da dahil olmak üzere dil uzantılarının programlanması
    • Projenizde kullanılan bulut hizmetlerinin resmi uzantıları
    • Kod biçimlendiricileri

İkinci yaklaşım için dev.nix dosyanıza IDE uzantılarını ekleyebilirsiniz. (<publisher>.<id> biçiminde) tam uzantı kimliğini bulup idx.extensions şöyle bir nesnedir:

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

Ortak hizmetler ekleyin

IDX, kullandığınız yaygın hizmetler için basitleştirilmiş kurulum ve yapılandırma da sunar. geliştirme sırasında ihtiyaç duyabileceği sorunlar:

  • Kapsayıcılar
    • Docker (services.docker.*)
  • Mesajlaşma
    • Pub/Sub Emülatörü (services.pubsub.*)
  • Veri tabanları
    • MySQL (services.mysql.*)
    • Postgre'ler (services.postgres.*)
    • Redis (services.redis.*)
    • Spanner (services.spanner.*)

Bu hizmetleri çalışma alanınızda etkinleştirmeyle ilgili ayrıntılar için services.* sayfasını inceleyin dev.nix referansının bölümleri.

Önizlemeleri özelleştir

Uygulama önizlemelerinizi nasıl özelleştireceğinizle ilgili ayrıntılar için şu uygulamanın dokümanlarına bakın: önizlemeleri görüntüleyin.

Çalışma alanı simgenizi ayarlama

adlı bir PNG dosyası yerleştirerek çalışma alanınız için özel bir simge seçebilirsiniz. .idx dizinindeki dev.nix dosyasının yanında icon.png. IDX kontrol panelinizde çalışma alanınızı temsil etmek için bu simgeyi kullanır.

Bu dosya, Git gibi kaynak kontrolüne aktarılabileceğinden ve projenizde çalışan herkesin kendi projenizde aynı simgeyi iyi bir örnektir. Dosya Git dallarına göre değişebileceğinden, "beta" üzerinde çalışırken çalışma alanlarını görsel olarak bile ve "üretim" örneğin, uygulamanızın sürümleri.

Özelleştirmelerinizi bir şablona dönüştürün

Ortam yapılandırmanızı "başlangıç ortamına" dönüştürmek için herkes için hakkında daha fazla bilgi edinmek için özel bir şablonunu seçin.

Tüm özelleştirme seçeneklerini görün

Ayrıntılı bilgi için dev.nix referansını inceleyin ortam yapılandırma şemasının açıklaması.