Update tsconfig paths and add `vue-shim.d.ts`

Update paths in `shell/tsconfig.paths.json` to include "@components/*" alias that maps to "../pkg/rancher-components/src/components/*". Typescript was unable to properly locate components using the `@components` alias because this path was not defined.

Add declarations to support our i18n plugin to `shell/types/vue-shim.d.ts` so that `this.t()` and the `t` component can be recognized in components utilizing `defineComponent`.

Signed-off-by: Phillip Rak <rak.phillip@gmail.com>
This commit is contained in:
Phillip Rak 2024-01-10 09:05:01 -07:00
parent 610b826319
commit 455fd39c58
2 changed files with 46 additions and 1 deletions

View File

@ -12,7 +12,10 @@
],
"@pkg/*": [
"../shell/pkg/*"
],
"@components/*": [
"../pkg/rancher-components/src/components/*"
]
},
},
}
}

42
shell/types/vue-shim.d.ts vendored Normal file
View File

@ -0,0 +1,42 @@
// eslint-disable-next-line no-unused-vars
import Vue, { ComponentCustomProperties } from 'vue';
declare module '*.vue' {
export default Vue;
}
// This is required to keep typescript from complaining. It is required for
// our i18n plugin. For more info see:
// https://v2.vuejs.org/v2/guide/typescript.html?redirect=true#Augmenting-Types-for-Use-with-Plugins
declare module 'vue/types/vue' {
// eslint-disable-next-line no-unused-vars
interface Vue {
/**
* Lookup a given string with the given arguments
* @param raw if set, do not do HTML escaping.
*/
t: {
(key: string, args?: Record<string, any>, raw?: boolean): string;
(options: { k: string; raw?: boolean; tag?: string | Record<string, any>; escapehtml?: boolean }): string;
};
}
}
declare module '@vue/runtime-core' {
// eslint-disable-next-line no-unused-vars
interface Vue {
t: {
(key: string, args?: Record<string, any>, raw?: boolean): string;
(options: { k: string; raw?: boolean; tag?: string | Record<string, any>; escapehtml?: boolean }): string;
}
}
// eslint-disable-next-line no-unused-vars
interface ComponentCustomProperties {
$t: {
(key: string, args?: Record<string, any>, raw?: boolean): string;
(options: { k: string; raw?: boolean; tag?: string | Record<string, any>; escapehtml?: boolean }): string;
}
}
}
declare module 'js-yaml';