#typescript #vue.js #plugins #vuejs2
Вопрос:
Контекст
Я пишу пользовательский плагин для веб-SDK OneSignal, и я не могу заставить VSCode отслеживать объявления типов плагинов/завершение кода и т. Д… Я хочу, чтобы плагин был доступен глобально из всех компонентов приложения через пользовательский экземпляр $ property или глобальное свойство (попробовал оба). VSCode не реагирует на мое расширение интерфейса Vue. Документация Vue очень голая, и все, что я пытаюсь, не работает.
Код
Плагин
У меня есть плагин VueOneSignal
, определенный так:
src/плагины/plugin.ts:
const VueOneSignal = {
install(Vue: any) {
Vue.prototype.$VueOneSignal = OneSignal as IOneSignal;
}
}
export default VueOneSignal;
OneSignal
Объект-это то, что я хочу предоставить приложению во всех компонентах, и он будет содержать все функции, которые я хочу в плагине, и определен выше в том же файле. Я хочу, чтобы функции можно было вызывать с помощью чего-то вроде this.$VueOneSignal.init(<string>)
. Здесь у нас есть только 1 функция init
:
const OneSignal: IOneSignal = {
init(appId: string) {
// do something
}
}
и интерфейс над этим:
interface IOneSignal {
init: (appId: string) => void;
}
плагин.d.ts
У меня есть файл типизации в src/plugins/plugin.d.ts:
interface IOneSignal {
init: (appId: string) => void;
}
declare module 'vue/types/vue' {
export interface Vue {
$VueOneSignal: IOneSignal;
}
}
вот что я прочитал, это правильный способ увеличить Vue, чтобы обнаружить свойство из приложения и его компонентов.
Использование плагина
В моем основном файле.ts я использую его как так:
import VueOneSignal from '@/plugins/plugin';
Vue.config.productionTip = false;
Vue.use(VueOneSignal);
Invocation
Finally, when I go into the src/components/HelloWorld.vue and attempt to call the function, it works (as in the code runs) but I get a CLI error and don’t get the TS benefits like code completion, type-checking etc… If I hover over this.$VueOneSignal
, it is marked as any
type.
I wish the documentation for using Vue Vue plugins Typescript was better. Does anyone know what I can do to fix this?