• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

vue + typescript visual studio报错 [ts] 类型“ThisTypedComponentOptionsWithArray ...

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

由于标题字数的限制无法全部复制过来,全部的错误提示是这样的

[ts] 类型“ThisTypedComponentOptionsWithArrayProps<Vue, object, object, object, never> | ComponentOptions<Vu...”上不存在属性“type”。

vue(render + JSX) + typescript  开发前端组件的时候,子组件定义的属性,在父组件中应用时,用到子组件定义的的属性,之前这个项目是没有问题的,由于后来开发的时候重新npm install以后,

第一步: (node -> 6.9.0, npm -> 3.10.8)vscode 出现了贴出来的错误,且 npm run dev 时,无法编译通过。

第二步: 向同事请求支援后将=环境更新为 node -> 8.1.3, npm -> 6.0.1, 还是会提示错误信息,考虑这个错误提示中thistypedcomponent......是使用因为使用了vue-class-component, 于是搜寻vue-class-component 的使用, 在StackOverflow有人说vue-class-component 不支持 typescript 2.6.1 ,更新为typescript为 2.5.3(2.7.1 也行) 以后就可以了,一看我的项目里typescript 是2.6.2,立马更新为2.5.3, 不幸的是错误提示还存在,好的事情是npm run dev 编译成功了,没有报错。(其实这个经过我的测试, vue-class-component 是支持typescript2.6.1的,可能那位同学的其他环境没搭好, 另外vue-class-component v6.0.0仅支持Vue v2.5类型。请为Vue v1.x使用vue-class-component v3.x.)

但是这个问题存在vscode中说明问题是存在的,在StackOverflow上有人说是vscode的配置问题,在修改一通后还是没用, 呼呼呼。

第三步: 不行了先放一放,下班回家试试另外电脑的vscode,看是否是vscode的配置问题,结果回来用笔记本在更新typescript的时候居然收到 报错 write after end 的错误提示, 原来因为npm 的版本太高了造成的(此时的npm 版本是6.0.1), 将npm版本降低为5.6.0以后,typescript 2.5.3 更新成功了,然后令人惊喜的是,vscode的类型错误的提示消失了,这简直太出乎意料了。

 

不想看过程的,直接看结果, 环境更新的过程是 ,最后一个是完全正常的配置

node (6.9.0) + npm(3.10.8)  + typescript(2.6.2) +vue-class-component (6.1.2)---> node(8.1.3) + npm(6.0.1) + typescript(2.6.2) +vue-class-component (6.1.2)-> node(8.1.3) + npm(5.6.0) + tyepescript(2.5.3) +vue-class-component (6.1.2)

1.父组件

 

2.子组件

npm run dev编译出现错误

然而事情没有想象中那么顺利,昨天晚上测试的时候是完全OK的,今天早上一打开vscode,傻眼了,怎么又报错了,在更新了环境以后,还是没有得到想要的结果,双手在键盘上轻轻的乱点,眼睛乱瞟,咦,等等,好像看到了啥,

 

​​​​​​

咋,原来vscode 启用的vscode默认的typescript的默认版本2.9.2, 欣喜若狂啊,点开是这样的,选择use workspace version 2.5.3,ok,错误提示瞬间消失,浪里个浪儿

 

 

经过测试,上面的环境都是成功的,我最后能够成功的配置是这样, npm的版本只是安装有的环境时版本过高,降低版本号就可以了

node(8.1.3) + npm(6.0.1) + tyepescript(2.6.2) +vue-class-component (6.1.2) (确保vscode的配置和这个一样)

 


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
搭建JavaScript和TypeScript开发调试环境发布时间:2022-07-18
下一篇:
Web3DGame之路,Babylonjs和TypeScript学习笔记(二)发布时间:2022-07-18
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap