vue2 项目升级 vue3 之 gogocode 代码转换规则覆盖情况(实践一)
Vue 2 的生命周期即将走到尽头,官方宣布 Vue 2.7 是最后一个次级版本更新,自 2022 年 7 月 1 日起提供 18 个月的长期支持,但此后将不再提供新特性。
尽管 Vue 2 将在 2023 年 12 月 31 日后继续存在于分发渠道中,但不再进行更新,包括安全修复和浏览器兼容性修复。因此,升级到 Vue 3 已成为必然趋势。
然而,Vue 3 与 Vue 2 的改动较大,存在许多非兼容性更新,这让升级变得复杂。重新开发似乎是一个选项,但实在太过耗时。
今天,我们将探讨阿里巴巴的 gogocode 工具,看看它如何帮助我们的项目迁移,并带来哪些惊喜。
首先,让我们了解 gogocode 的升级代码转换规则覆盖情况。
以 v-for 中的 Ref 数组为例,Vue 2 中,v-for 会用 ref 数组填充相应的 $refs 属性,但在嵌套 v-for 时,这种行为变得不明确且效率低下。
异步组件在转换前后代码没有变化,但代码运行时会报错,需要引入 “defineAsyncComponent” 来实现异步引入。
attribute 强制行为在转换前后代码没有变化,需要注意的是 Vue 2.x 和 Vue 3.x 的属性规则有所不同。
$attrs 包含 class 和 style,这是父作用域中不作为 prop 被识别的特性绑定。
$children 是当前实例的直接子组件,需要注意它并不保证顺序,也不是响应式的。
自定义指令和自定义元素交互在 Vue 3 中存在一些非兼容性更新,gogocode 提供了兼容方法。
Data 选项在 Vue 3 中只有函数形式一种,而 Vue 2.x 有两种形式。
emits 选项用于触发当前实例上的事件,事件 API 包括 $emit、$on、$once 和 $off。
过滤器在 Vue.js 中允许自定义过滤器,用于常见的文本格式化。
更多关于 gogocode 的实践,请关注后续分享。
版权声明:本文由哟品培原创或收集发布,如需转载请注明出处。