Vue 打字稿插件

Question

我正在写一个 vue 记录器插件

export default new (class NestLogger {
  public install(Vue: any) {
    Vue.prototype.$log = this;
  }

  error(text: string) {
      console.log(text)
  }
})();

在 main.ts 中

import logger from "./plugins/logger";
Vue.use(logger);

但在组件中我无法引用 this.$log - 为什么？

在 Login.vue 中

this.$log.error("bla"); 

错误：Property $log does not exist on type Login

Answer 1

您需要在.d.ts 文件中添加augment the vue type definitions 以包含$log 的类型定义：

// src/my-log-plugin.d.ts
import Vue from 'vue'

declare module 'vue/types/vue' {
  interface Vue {
    $log: {
      error: (message: string) => void
    }
  }
}

export {}