visual studio code - VSCode'da Özel Bir TypeScript dil hizmeti eklentisi geliştirme

VSCode'da bir TSserver eklentisi geliştirmeye çalışıyorum ama sunucunun eklentimi yüklemesini sağlayamıyorum

tsconfig.json'da yolu yerel bir yol ve node_modules yoluna ayarlamayı denedim

Bence bu, eklentiyi çalıştırması gereken çok minimalist bir proje https://github.com/Spensaur-K/minimal-tsserver-plugin

Sunucu plugini yüklemiyor. Plugine mesaj kaydetmiyor veya plugin içine bir hata koyarsam çöküyor.

Cevap #1

TS Sunucusunda özel bir eklentiyi bir dosyadan sunulurken yükleyebilmemi sağlayan tek yol:

  1. Yerel TypeScript kullanarak çalışma alanı yapılandırmasını etkinleştir:
npm i typescript

package.json:

{
  "dependencies": {
    "typescript": "^4.2.3"
  }
}

.vscode/settings.json
{
  "typescript.tsdk": "./node_modules/typescript/lib",
  // ~/.config/Code/logs/**/tsserver.log
  "typescript.tsserver.log": "verbose",
  "typescript.enablePromptUseWorkspaceTsdk": true
}

Yerel TypeScript kullanmak önemlidir, çünkü TypeScript, TS Sunucusunun çalışma dizininde ve yukarısında node_modules içindeki paket adıyla eklentiyi arayacaktır. Küresel TypeScript kullanılmaya çalışılırsa (/usr/local/lib/node_modules/typescript/lib), tsserverın çalışma dizini o civarda olacak ve eklentiniz bu yolun yakınında olmayacaktır.

Verbose kullanmak isteğe bağlı görünüyor, çünkü TS Server'daki eklenti yükleme ile ilgili tüm mesajlar bilgi düzeyinde gibi görünüyor, ama hiçbir şeyi kaçırmadığımdan emin olmak için bunu etkinleştirdim, çünkü bunu hata ayıklamak zaten yeterince yapmacık: günlüklere bakmak için, bir TS/JS dosyasında iken Cmd+Shift+P tuşlarına basın ve TypeScript: Açık TS Sunucu Günlüğünü Göster'i seçin.

İş yeri TypeScript sürümü için istemi etkinleştirmek de isteğe bağlıdır, aksi takdirde bir TS/JS dosyasında Cmd+Shift+P tuşlarına basıp TypeScript: TypeScript Sürümünü Seç seçeneğini seçerek ve bunu .vscode/settings.json dosyasında yapılandırılmış iş yeri sürümüne değiştirerek manuel olarak yapmanız gerektiğini unutmanızı önlemeye yardımcı olur.

  1. Proje dizininizde node_modules/plugin içinde eklentinizi oluşturun

Burası optimal olmayan kısım, eklentiye ait kaynak kodunun node_modules içinde olmasından nefret ediyorum, ama onu taşımak için bir yol bulamadım, çünkü TS Server'ın çalışma dizini artık proje dizininizin node_modules içinde ve bir üst dizin proje dizininizin üstündeki node_directory, ve böyle devam ediyor. Eklenti kodunuzun bu zincirde olmasına gerek kalmayacak şekilde nasıl yapabileceğimi bilmiyorum.

node_modules/plugin/package.json:

{
  "name": "plugin"
}

node_modules/plugin/index.js:

module.exports = function init(modules) {
  function create(info) {
    const service = info.languageService;
    info.project.projectService.logger.info(
      "Started custom plugin"
    );
    return service;
  }

  return { create };
}

Eklentiyi doğrudan TypeScript ile yazmanın, transpile etmeden mümkün olduğunu düşünmüyorum.

  1. TS Sunucusunu eklentinizi kullanacak şekilde yapılandırın ve yeniden başlatın

tsconfig.json:

{
  "compilerOptions": {
    "plugins": [
      {
        "name": "plugin"
      }
    ]
  }
}

İsim bir dosya yolu olamaz (https://github.com/microsoft/TypeScript/issues/18623), bu yüzden burada eklentiyi bir Node paket ismiyle referans ediyoruz ve bu nedenle eklenti kaynak kodunu TS Sunucu çalışma dizinine giden node_modules zinciri içinde yerleştirme ile ilgili tüm hileler ortaya çıkıyor.

TS Sunucusunu yeniden başlatmak için bir TS/JS dosyasına gidin ve Cmd+Shift+P tuşlarına basın ve TypeScript: Restart TS Server seçeneğini seçin. Sonra tekrar Cmd+Shift+P tuşlarına basın ve TypeScript: Open TS Server Log seçeneğini seçin.

O zaman şöyle bir şey görmelisiniz (… proje dizininizi temsil eder):

Info 24   [09:59:19.919] Enabling plugin plugin from candidate paths: /…/node_modules/typescript/lib/tsserver.js/../../..,/Applications/Visual Studio Code.app/Contents/Resources/app/extensions/typescript-language-features
Info 25   [09:59:19.919] Loading plugin from /…/node_modules/typescript/lib/tsserver.js/../../.. (resolved to /…/node_modules/node_modules)
Info 26   [09:59:19.923] Started custom plugin
Info 27   [09:59:19.923] Plugin validation succeded

Eğer biri, eklentiyi node_modules dizininden değil de proje dizininizden doğrudan yüklemenin nasıl yapıldığını ya da yerel bir kurulum yerine global TypeScript kurulumunun nasıl kullanılacağını biliyorsa, sözü sizde!

Düzenle :

Yapılabilecek bir iyileştirme, node_modules/plugin/index.js dosyasını şu şekilde değiştirmektir:

module.exports = require('../../plugin.js');

Ve önceden orada olan kodu proje dizininizdeki plugin.js dosyasına taşıyın. Tüm bunları proje dizinimde herhangi bir node_modules dizini olmadan yapmanın bir yolu olmasını tercih ederdim, ama ne yazık ki.

Bunun için bir TypeScript hata raporu açtım: https://github.com/microsoft/TypeScript/issues/43124

Cevap #2

node_modules altındaki TS Server eklentileri yalnızca typescript'in bir çalışma alanı sürümünü kullanıyorsanız ve eklenti projeniz için tsconfig.json içinde listelenmişse yüklenir. Eklenti için göreli bir yol kullanmak da işe yaramayabilir.

Örneği çalıştırmak için:

  1. node_modules altında minimal-tsserver-plugin yükleyin
  2. Typescript'in çalışma alanı sürümünü kullanın

  3. tsconfig dosyanızda şunları bulundurun:

    {
  "compilerOptions": {
    "plugins": [
      {
        "name": "minimal-tsserver-plugin"
      }
    ]
  }
}

İlgili makaleler