Typescript 关于Vue 3+的问题；用于插件的类型脚本和扩充类型

有人知道一个关于如何使用Vue3和TypeScript实现类型扩充的工作示例吗？我一直试图在Vue3中使用相同的Vue2文档，但没有成功，并且花了3个小时的时间进行搜索，没有任何结果

似乎应该增强

Vue类组件

模块中的

Vue

对象以使其工作，但如何增强

我的实现类似于以下内容：

有什么建议吗

---

据我所知，

vue类组件

尚未完全支持vue 3。它们还在图书馆里。所以，我不知道下面的例子是否适用于它，但这就是我为扩充插件类型所做的

你好，plugin.ts

import { App } from "vue";

export interface IHelloModule {
  sayHello: (name: string) => string;
}

export default {
  install: (app: App) => {
    const helloModule: IHelloModule = {
      sayHello: function(name: string) {
        return `Hello ${name}`;
      }
    }; 

    app.config.globalProperties.$hello = helloModule;
  }
}

declare module "@vue/runtime-core" {
  //Bind to `this` keyword
  interface ComponentCustomProperties {
    $hello: IHelloModule;
  }
}

我在插件文件本身中声明了类型，但是您也可以在vue.d.ts文件中声明它们

梅因酒店

import { createApp } from "vue";
import App from "./App.vue";
import router from "./router";
import Hello from "./hello.plugin";

createApp(App)
  .use(router)
  .use(Hello)
  .mount("#app");

你好，vue

<script lang="ts">
import { defineComponent } from "vue";

const Hello = defineComponent({
  mounted() {
    console.log(this.$hello.sayHello("World"));
  }
});

export default Hello;
</script>

从“vue”导入{defineComponent}；
常量Hello=defineComponent({
安装的（）{
log（this.$hello.sayHello（“世界”）；
}
});
导出默认Hello；

import { createApp } from "vue";
import App from "./App.vue";
import { helloPlugin } from "./hello";
import router from "./router";

createApp(App)
  .use(router, helloPlugin)
  .mount("#app");

import { App } from "vue";

export interface IHelloModule {
  sayHello: (name: string) => string;
}

export default {
  install: (app: App) => {
    const helloModule: IHelloModule = {
      sayHello: function(name: string) {
        return `Hello ${name}`;
      }
    }; 

    app.config.globalProperties.$hello = helloModule;
  }
}

declare module "@vue/runtime-core" {
  //Bind to `this` keyword
  interface ComponentCustomProperties {
    $hello: IHelloModule;
  }
}

import { createApp } from "vue";
import App from "./App.vue";
import router from "./router";
import Hello from "./hello.plugin";

createApp(App)
  .use(router)
  .use(Hello)
  .mount("#app");

<script lang="ts">
import { defineComponent } from "vue";

const Hello = defineComponent({
  mounted() {
    console.log(this.$hello.sayHello("World"));
  }
});

export default Hello;
</script>