0x00 前言
要用uniapp开发微信小程序，首先要用uniapp搭建框架，然后再IDE里面编写代码，然后通过uniapp的打包命令，打包成微信小程序的代码。
这个过程需要调试，所以需要安装"微信开发者工具"，把上述打包后的代码导入到微信开发者工具。
如下图：
0x01 开启调试
要开启调试，点击微信开发者工具中的按钮"调试器"，如下图所示：
即可打开调试界面，看起来和浏览器的界面比较类似，调试的方式也和浏览器类似，一般都是打断点或者log日志。
0x02 断点调试
首先需要找到可以调试的代码，打开Sources标签也，找到appContext文件夹，可以看到源代码： 
0x03 调试代码
要能够调试代码，需要开启sourcemap，再uniapp的项目中，打包的选项中，添加sourcemap，如下设置:
添加sourcemap后，便可以调试代码了。 可以看到ts和vue源文件。
0x04 调试的局部变量问题
调试的时候，如果存在一些变量，会发现鼠标移动到变量上的时候并不能如预期显示变量的值，这是因为代码进行了压缩，一些变量在真实的运行环境中，变量名称修改了，调试的时候，能够显示的是修改了名称的变量，比如原本的变量名称是 let total = xxxx，但是修改后，变量名称变成了t，调试的时候只能看到t而看不到total，这对于调试很不友好。 下面的文章说可以通过选项启用变量名称解析:
Chrome DevTools: Resolve Variable Names when debugging using Source Maps
关于JS+sourcemap调试：打开局部变量解析设置
但是发现并没有这个选项，不止微信工具没有，chrome浏览器也没有。 如果有人配置过，还请告知。 最终解决的方案是，在开发模式下不压缩代码,配置如下:
minify: process.env.NODE_ENV === "development" ? false : "terser",
ini
build: {
// 开发阶段启用源码映射：https://uniapp.dcloud.net.cn/tutorial/migration-to-vue3.html#需主动开启-sourcemap
sourcemap: process.env.NODE_ENV === "development",
minify: process.env.NODE_ENV === "development" ? false : "terser",
},0x05 console不起作用问题console
console 在调试的时候很有作用，实际测试中，console不起作用，那是因为默认的压缩配置，启用了drop_console,如下：
yaml
terserOptions: {
compress: {
//生产环境时移除console
drop_console: true,
drop_debugger: true,
},
},当然如果，不启用minify的情况下，这个也就不会生效了。