关于Vue3源码的调试

253 阅读1分钟

Vue3 已经被尤大大推出来了很长时间了,在使用过 Vue3 的compositionApi后就感觉很喜欢这样的编程风格,自由度、复用性都很高,但是对于我们来说调用这些api的方式就是像一个黑盒子一样, 不知道他在里面干了什么事情,这里为了一些和我一样正在学习vue3的小白更好的了解vue的新特性,特在这里记录下如何在本地调试vue3的源码.

  1. 从官方那边下载克隆下来项目

  2. yarn install

// package.json

"scripts": {
  "dev": "node scripts/dev.js --sourcemap",  这行加上 --sourcemap  调试debugger时候指向源码位置
  ...
},

  1. 新建html 引入 /packages/vue/dist/vue.global.js (实际上这个是vue打包后的包)

Snipaste_2021-07-11_17-14-33.png

  1. yarn dev

  2. 在需要测试的位子直接debugger即可 src=http___5b0988e595225.cdn.sohucs.com_images_20180821_58b2ba0664994492868542ee01b7213b.jpeg&refer=http___5b0988e595225.cdn.sohucs.jfif