V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
jenson47
V2EX  ›  Vue.js

vue3 的 template typescript 支持稀烂,退坑

  •  
  •   jenson47 · 55 天前 · 2984 次点击
    这是一个创建于 55 天前的主题,其中的信息可能已经有所发展或是发生改变。

    截止目前 vue3 已经发布 4 年多了,用了几个月 vue3 ,template 的 typescript 支持真的稀烂。

    不吹不黑,如果说 tsx 的 typescript 支持跟 vue3 的 template 支持差距不大,也就不说了,tsc 检查 template 无法提示组件不存在的属性,官方 vscode 插件 vue official 2.2.8 版本 用起来更是让人蛋疼,组件自动识别飘忽不定,高亮也是飘忽不定,就连 script 部分提示也会出错。

    也许你会说重启试试,无法自动导入,手动导入呀,template 支持不行,你也可以用 tsx 写呀

    也有人说,我写代码就是一把梭,复制粘贴,什么 typescript ,直接 anyscript 和 unkonwscript 走起

    我只能说对对对

    27 条回复    2025-04-29 11:20:47 +08:00
    wtf12138
        1
    wtf12138  
       55 天前
    不太清楚 我 low js 一把梭
    Genshin2020
        2
    Genshin2020  
       55 天前
    是的,我新项目用 vue3 js
    MRG0
        3
    MRG0  
       55 天前
    依旧在用 js
    yangth
        4
    yangth  
       55 天前
    不知道,不用 ts
    murmur
        5
    murmur  
       55 天前   ❤️ 2
    ts 对我来说是开发阻力,IDE 自带的提示就够了
    jenson47
        6
    jenson47  
    OP
       55 天前
    @murmur 量级大了,组件引入组件类型检查这些就很麻烦,除非你这是个人项目,如果一个团队,谁也确保不了谁在偷偷写 bug ,得慢慢排查。
    musi
        7
    musi  
       55 天前
    @jenson47 你用 ts 也无法保证谁在偷偷写 bug ,不还是得慢慢排查
    flmn
        8
    flmn  
       55 天前
    索引 vue 插件我一直回退到 2.1.10 版本用呢,高版本保存文件卡死,format 的问题。垃圾
    lee88688
        9
    lee88688  
       55 天前
    这种可能需要在 vue 上用 tsx 了,这个在 ts 是一等公民。
    HTML001
        10
    HTML001  
       55 天前
    TS+vue template 很别扭,要么接受这种不完整,要么选择 tsx 吧
    UnluckyNinja
        11
    UnluckyNinja  
       55 天前 via Android
    提示不存在的属性这个有,要开启一个严格设置选项,但是吧,非常不自由,透传 props 会比较麻烦。我是只想要提示找不到类型的组件,这个 vscode 官方扩展不支持,最后是靠 eslint 解决的。高亮问题就是 30 行+后变量会丢失高亮,这个一直没修,可能是因为没人报 issue 。其他方面都还好,vue 和 vite 社区非常强大,vueuse 、auto-import 等,不会因为这俩问题放弃整个生态
    Jack927
        12
    Jack927  
       55 天前
    你别说这个还真是,我们这 20 多万行代码的一个项目,突然一天,一个模板写法的文件导致 dts 编译不出来了,2 个人排查了 2 天搞不定,最后花半天 tsx 重写掉了。
    CHTuring
        13
    CHTuring  
       55 天前   ❤️ 4
    说到底还是 vue official 太难用了。等下作者又要抑郁了,说来自中国的开发者网暴,又把扩展删了重新上传。哈哈哈哈
    horizon
        14
    horizon  
       55 天前
    @Jack927 #12
    20 万行代码的项目,半天就改完了?
    CHTuring
        15
    CHTuring  
       55 天前
    虽然我工作是用 vue ,但是 React 、Svelte 也能选啊,何必吊死在这棵树上。
    wangtian2020
        16
    wangtian2020  
       55 天前
    不是 vue3 的支持烂,是那个插件烂,插件也是刚转正,人家用爱发电开发的,能用不错了
    我从来不写 tsx 的直接写元素标签,不用 tsx 写法不就完全 typescript 支持了吗
    不用 typescript 真不行,对象点.不出来东西我就焦虑
    zdw189803631
        17
    zdw189803631  
       55 天前
    谁叫 jsx 亲儿子呢
    ochatokori
        18
    ochatokori  
       55 天前
    附议,vue 对 ts 的支持就是烂,根本不用
    Jack927
        19
    Jack927  
       53 天前
    @horizon #14 一个文件
    ipcjs
        20
    ipcjs  
       8 天前
    @CHTuring 说到底还是尤雨希的锅。
    死抱着个破模板不放,为了那么点 DOM 性能,硬要用模板。前端差那么点破性能嘛。有跟 Vue3 的类型提示斗争的时间,什么 x 界面都可以老早 copy 完了🫠
    前段时间还看到“下一代 Vue“又在发明写在 setup 里面的模板了🌚,真是不愁累不死插件作者
    iceprosurface
        21
    iceprosurface  
       6 天前 via Android
    @ochatokori

    试试我这个方案,ts 体验很好,vue3 版本刚开发玩,vue2 的用了很久了。

    https://vueireact-docs.vercel.app/

    https://github.com/iceprosurface/vueireact
    iceprosurface
        22
    iceprosurface  
       6 天前 via Android
    再补充一个 playground 地址,可以直接试试语法

    https://vueireact-repl.vercel.app/
    jenson47
        23
    jenson47  
    OP
       4 天前
    @iceprosurface
    vue3 的 ts 出现两个问题,1. vue 对 ts 支持不是很完善,在 template 里很多无法自动补全,template 的 ts 校验也没有
    2. 由于体量大,vscode 的 typescript 默认有限制,需要将设置放开[typescript.preferences.includePackageJsonAutoImports 设置]( https://github.com/microsoft/TypeScript/issues/53116)


    后面尝试了 tsx 格式,发现在 ts 声明上还是有问题,然后我用了 [vue tsx 类型申明增强]( https://github.com/aibayanyu20/vite-plugins/tree/main/packages/tsx-resolve-types)“
    如何使用 [在 vue3 中更丝滑的去使用 tsx]( https://juejin.cn/post/7323088217334743059)
    daliusu
        24
    daliusu  
       3 天前
    直接用 tsx 就行了,.vue 压根没法用,vue official💩一样,又卡提示又不稳定
    iceprosurface
        25
    iceprosurface  
       3 天前
    @jenson47 #23

    你说的这个我之前用过,项目大了以后 defineComponent 很卡的,而且最关键的是类型声明很麻烦。

    所以最后考虑是放弃一点性能,完全依靠官方 ts 的语法来实现,所有的属性都从 props 传递,scoped slot 用 children 约束:



    这样编辑器也不卡了,写起来还方便
    iceprosurface
        26
    iceprosurface  
       3 天前
    你们可以试试在线去看看这个实现: https://s.icepro.top/TFXr5z

    泛型什么支持也都很好用

    runlongyao2
        27
    runlongyao2  
       1 天前
    你说的不提示能举几个例子么?因为我也用 vue3 的 ts ,觉得也还好,没特别困难
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   839 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 21ms · UTC 21:04 · PVG 05:04 · LAX 14:04 · JFK 17:04
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.