javascript / expert
Snippet
Global Property Augmentation for TypeScript Safety
When adding global properties to a Vue instance (e.g., via app.config.globalProperties), TypeScript won't recognize them on 'this' or in templates. Module augmentation extends the core interfaces so your custom globals are fully typed across the project.
snippet.js
javascript
1
2
3
4
5
6
declare module '@vue/runtime-core' {interface ComponentCustomProperties {$translate: (key: string) => string;$http: typeof axios;}}
vue
Breakdown
1
declare module '@vue/runtime-core' {
Tells TypeScript to augment the existing Vue core module.
2
interface ComponentCustomProperties {
Targets the specific interface used for instance-level properties.
3
$translate: (key: string) => string;
Defines the signature for a global translation helper.