问答

shims-vue.d.ts 不能扩展vue对象

作者:admin 2021-04-18 我要评论

我最近用ts+vue的过程中遇到了需要扩展vue对象的情况,通过@vue/cli 4.x生成项目,shims-vue.d.ts如下 declare module '*.vue' { import Vue from 'vue' export ...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

我最近用ts+vue的过程中遇到了需要扩展vue对象的情况,通过@vue/cli 4.x生成项目,shims-vue.d.ts如下

declare module '*.vue' {
  import Vue from 'vue'
  export default Vue
}

declare module 'test-module'; //自己用js写的模块

想实现功能:通过 vue.minxin(SomeMixin) 了一个 全局mixin,提供了 a属性b方法,因此需要扩展Vue对象的定义使得ts编译不报错。
根据vue-cli官方文档如下
image.png

因此我想在shims-vue.d.ts里面直接对vue对象进行扩展,如下

import Vue from 'vue'
declare module 'vue/types/vue' {
 interface Vue {
   a: string;
   b: () => void
 }
}

declare module '*.vue' {
 export default Vue
}

declare module 'test-module'; //自己用js写的模块

最终结果 不但我想要的对象没有扩展上去,并且之前对*.vue的声明,自定义模块的声明等全部失效。
问题:

  1. 这种全局mixin怎么声明比较好
  2. 如果我想在shims-vue.d.ts里面对vue进行扩展该怎么做(貌似会对以前的声明产生影响)
  3. 为什么我这么修改shims-vue.d.ts会对*.vue文件的声明产生影响

谢谢各位大佬,问题困扰挺久了,找了各种资料,感觉自己还是每太想明白!!

###

image.png

务必要写 declare module 里面,写里面写外面是截然不同的意思……

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • nginx响应速度很慢

    nginx响应速度很慢

  • 点击选中的多选框,会在已选那一栏显示

    点击选中的多选框,会在已选那一栏显示

  • PHP 多态的理解

    PHP 多态的理解

  • 关于C语言中static的问题

    关于C语言中static的问题

腾讯云代理商
海外云服务器