技术不革新带来的问题负担-剖析vue2.5源码的bug

问题背景

1.团队已经在一个A项目中落地实践了一套Cypress前端测试方案，A项目使用的Vue框架是2.6.12，
2.现在有一个B项目，我需要把这套测试方案从A项目搬运到B项目，
3.虽然A项目和B项目都是使用Vue框架，但是B项目使用的是基于Vue@2.5.2魔改的@xf/vue，
4.在方案落地B项目过程中遇到了很多之前在A项目中没有遇到的问题，
5.运行测试用例时，控制台飘红，[Vue warn]: The setup binding preperty 'xxx' is already declared.

排查

找出直接原因

先在打印报错的地方打个断点，分析下代码的执行逻辑，找出代码报错的直接原因。

查看Call Stack调用栈，如下图：

看asVmProperty这个函数是怎么写的，如下图：

从asVmProperty这个函数（主要看if语句的判断），我们可以找到直接原因：前置判断如果propName在vm中已经有了，直接报错不允许重复定义。

为什么会重复定义

我们可以在if语句这里打一个条件断点，证明我们的思路是不是正确的。条件断点为propName === 'cardList'

重新执行后会发现条件断点确实触发了两次，第一次vm上没有cardList，第二次vm上有cardList，所以第一次没有报错，第二次的时候控制台报错了。

第一次触发条件断点的截图：