也许这个问题比较基础吧，找了半天也没找到，有的说要安装插件，有的说要改什么配置，晕晕的，害得我一直以为工程化的开发环境下无法直接进行调试呢，直到有一天，偶然发现了。。。（另外这是vue3，没试过vue2 是啥样的。）

代码去哪里了？

以往的经验呢，想要调试我们写的js代码，会按F12 找到 Soursces 标签，找到自己写的代码，设置上断点即可。

但是用工程化的方式做的项目，开发模式下看到的却是这个样子的，这个我写的代码去哪里了？

代码走丢了，上面的js文件全是看不懂的代码，不要急，代码没丢，只是搬家了。

代码在下面

一次偶然的机会才发现原来代码躲在了这里，害得我用了好久的console。

文件结构和我们写的代码是一毛一样的，终于找到了，只是这么多双胞胎呢？那个是真的呢？都点一下就知道了。

设置断点

找到了代码，下一步就是设置断点了，试一试，果然还用。

鼠标放在上面也可以查看变量情况，只是截图没截下来。

看看node对象到底有啥。

在下面的地方之间写对象名，就可以看到内容。

果然好复杂，看不懂。

这下终于可以不用写console.log了。