366 字
1 分钟
TypeScript：给代码穿上防弹衣 (虽然很重)
TypeScript：心态崩了
毁灭吧，赶紧的。累了。
无尽的报错
TypeScript 说是给代码穿上防弹衣，防止低级错误。但实际上，它更像是给我的手戴上了镣铐。
Type 'string | null' is not assignable to type 'string'.
Property 'xyz' does not exist on type 'ABC'.
我知道！我知道它是 null！我明明加了判断，但一进异步回调或经过一次可变引用，类型收窄又失效了。直接写 as string 或 ! 虽然能让红线消失，却也可能把真正的空值问题一起藏起来。
尤其是在 Vue 组件的 Props 定义里，结合 defineProps 和泛型，写起来那叫一个酸爽。为了解决一个类型报错，我可能要写几十行的 interface 定义。这到底是写业务逻辑，还是在做类型体操？
为什么这么难？
这类报错最容易让我彻底破防。后来我给自己定了个顺序：先把外部输入收窄成可靠类型，再处理业务逻辑；能改类型定义就不强制断言，确实不可能为空时才用非空断言。红线没有立刻少很多，但运行时的惊喜少了。
前端不就是画画界面调调接口吗？为什么要搞这么复杂？Webpack 还没整明白，Vite 又来了；Vue 3 又变了。学不动了，真的学不动了。
分享
如果这篇文章对你有帮助，欢迎分享给更多人！
TypeScript：给代码穿上防弹衣 (虽然很重)
https://blog.luozili.work/posts/vue-learning-9/ 部分信息可能已经过时
相关文章 智能推荐
1
前端性能优化：只要我跑得够快，Bug 就追不上我
Vue学习之路 从一个包含 Three.js 和大量数据的页面出发，逐项记录代码分割、资源压缩、缓存与渲染优化。
2
生命周期钩子：生老病死，Vue 组件的一生
Vue学习之路 按创建、挂载、更新和卸载阶段梳理 Vue 3 组件生命周期，以及各类钩子的典型使用场景。
3
Ref vs Reactive：响应式的哲学思考 (头秃篇)
Vue学习之路 对比 Vue 3 中 ref 与 reactive 的使用边界，以及解构、替换对象和模板自动解包时容易踩到的坑。
4
Vue 3 启航
Vue学习之路 从 jQuery 时代的回忆出发，记录第一次系统学习 Vue 3、Vite 与组合式 API 的过程。
5
我累了：试图理解源码，结果被源码理解了
Vue学习之路 记录第一次阅读 Vue 3 响应式和渲染器源码时，从建立入口地图到被 PatchFlags 劝退的过程。