0 Tage Serie
javascript / expert
Snippet

Global Property Augmentation für TypeScript-Sicherheit

Wenn globale Eigenschaften zu einer Vue-Instanz hinzugefügt werden, erkennt TypeScript diese nicht automatisch. Module Augmentation erweitert die Kern-Interfaces, sodass Ihre benutzerdefinierten globalen Variablen projektweit typisiert sind.

snippet.js
javascript
1
2
3
4
5
6
declare module '@vue/runtime-core' {
interface ComponentCustomProperties {
$translate: (key: string) => string;
$http: typeof axios;
}
}
vue
Erklärung
1
declare module '@vue/runtime-core' {
Anweisung an TypeScript, das bestehende Vue-Core-Modul zu erweitern.
2
interface ComponentCustomProperties {
Zielt auf das spezifische Interface für Eigenschaften auf Instanzebene ab.
3
$translate: (key: string) => string;
Definiert die Signatur für einen globalen Übersetzungshelfer.