Configuration
- TypeScript kursu
- Uzman
- Ders 30/35
- 5 dk
Plugin yapılandırma seçeneklerini eklersin.
Plugin yapılandırması
Plugin yapılandırması tsconfig.json'daki plugins dizisinde verilir. Her giriş bir name ve özel alanlar taşır. Plugin kodunda bu alanlara info.config üzerinden erişirsin.
// tsconfig.json:
// "plugins": [
// { "name": "my-plugin", "prefix": "[lint]" }
// ]Yapılandırma okuma
info.config undefined olabilir; bu yüzden ?. ve ?? ile güvenli okuma yaparsın. Özel alanlar için varsayılan değer vermek plugin'i sağlamlaştırır.
const prefix: string =
info.config?.prefix ?? "[lint]";Uygulama Yapılandırmalı plugin
Bir plugin yaz: info.config?.prefix ile yapılandırmadan prefix oku (varsayılan "[lint]"). getSemanticDiagnostics'i sar: tür eklemesi olmayan VariableDeclaration için bir diagnostic üret ve mesajı prefix ile başlat. Test: kaynak let x = 1;, config.prefix = "[X]"; ilk diagnostic'in messageText'ini yazdır.
Başlangıç kodu
import * as ts from "typescript";
// Bir plugin yaz: info'dan prefix ayarını oku
// - Yapılandırmadan prefix oku (varsayılan "[lint]")
// - Diagnostic metodunu sar
// - Tür eklemesi olmayan VariableDeclaration için diagnostic üret
// - Mesajı prefix ile başlat
// Test: prefix = "[X]" ile çağır, ilk diagnostic mesajını yazdır.
// kodunu buraya yazÖrnek çözüm
import ts from "typescript";
function createPlugin(info: ts.server.PluginCreateInfo): ts.LanguageService {
const ls = info.languageService;
const prefix: string = info.config?.prefix ?? "[lint]";
return {
...ls,
getSemanticDiagnostics: function(fileName: string) {
const prior = ls.getSemanticDiagnostics(fileName);
const sf = ls.getProgram().getSourceFile(fileName);
if (!sf) return prior;
const extras: ts.Diagnostic[] = [];
function visit(node: ts.Node) {
if (ts.isVariableDeclaration(node) && !node.type) {
extras.push({
file: sf,
start: node.getStart(sf),
length: node.getWidth(sf),
category: ts.DiagnosticCategory.Warning,
code: 9001,
messageText: prefix + " Missing type annotation",
});
}
ts.forEachChild(node, visit);
}
visit(sf);
return [...prior, ...extras];
},
};
}
const sf = ts.createSourceFile("app.ts", "let x = 1;", ts.ScriptTarget.Latest, true);
const fakeLs = {
getSemanticDiagnostics: function() { return [] as ts.Diagnostic[]; },
getProgram: function() { return { getSourceFile: function(n: string) { return n === "app.ts" ? sf : undefined; } } as unknown as ts.Program; },
} as unknown as ts.LanguageService;
const info = { languageService: fakeLs, config: { prefix: "[X]" } } as unknown as ts.server.PluginCreateInfo;
const plugin = createPlugin(info);
const diags = plugin.getSemanticDiagnostics("app.ts");
console.log((diags[0] as ts.Diagnostic).messageText);Beklenen çıktı
[X] Missing type annotation
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 info.config ne taşır?
- Diagnostic listesi
- SourceFile
- Plugin yapılandırma seçenekleri Doğru cevap
- Program nesnesi
Açıklama: info.config tsconfig.json'daki plugin yapılandırmasını taşır; Program, Diagnostic listesi veya SourceFile taşımaz.
2 Yapılandırma oku
const prefix: string = info.____?.prefix ?? "[lint]";
const prefix: string = info.config?.prefix ?? "[lint]";
Açıklama: info.config yapılandırma nesnesini taşır; options, settings ve plugin PluginCreateInfo üzerinde yoktur.
3 Config parçaları
| Kavram | Anlamı |
|---|---|
info.config |
Yapılandırma nesnesini taşır |
info.languageService |
Dil servisini taşır |
config.prefix |
Özel ayar örneğidir |
?? |
Varsayılan değer verir |