如何在Visual Studio Code中调试Meteor.js源码以排查运行报错？

我之前在调试Meteor项目时也碰到过类似的源码级调试需求，刚好能给你一套靠谱的步骤，帮你定位那个TypeError: Cannot read property 'length' of undefined的问题：

默认Meteor运行时用的是打包压缩后的代码，根本没法单步步入调试，所以得先搞一份和你项目版本一致的本地源码：

• 找个本地目录，克隆Meteor的官方Git仓库到这里
• 用meteor --version查看你当前项目使用的Meteor版本，然后切换到仓库对应的版本分支，比如版本是2.9.0的话，就运行git checkout release-2.9.0

进入你的Meteor项目根目录，启动项目时加上--local参数，比如：

meteor --local

如果你的项目需要配置文件，就改成：

meteor --local --settings settings.json

这个参数会让Meteor优先使用你本地克隆的源码，而不是默认的打包版本，这样才能调试源码里的代码。

打开VS Code并加载你的项目，按Ctrl+Shift+D打开运行和调试面板：

• 点击“创建launch.json文件”，选择“Node.js”环境
• 把自动生成的配置替换成下面的内容，注意替换本地Meteor源码的路径：

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Meteor Debug",
      "runtimeExecutable": "meteor",
      "runtimeArgs": [
        "--local",
        "--inspect-brk=9229"
      ],
      "port": 9229,
      "skipFiles": [
        "<node_internals>/**"
      ],
      "outFiles": [
        "${workspaceFolder}/**/*.js",
        "/你的本地Meteor源码路径/**/*.js"
      ]
    }
  ]
}

简单说下配置里的关键项：

• --inspect-brk=9229：让Meteor启动时暂停在入口处，方便你后续调试
• outFiles：指定VS Code需要调试的代码范围，包含你的项目代码和本地Meteor源码

• 先根据错误栈提示，找到本地Meteor源码中对应的文件（比如错误里提到的某个.js文件），在怀疑出问题的行设置断点（点击行号左侧的小红点）
• 点击调试面板的绿色启动按钮，Meteor会以调试模式启动，停在入口处，按F5继续执行
• 当程序运行到断点时，你可以用VS Code的调试工具：单步执行（F10）、步入函数（F11）、查看变量值、添加监视项，一步步找到为什么某个属性变成了undefined，进而触发了length读取错误

• 如果--local参数没生效，可以试试手动设置环境变量METEOR_LOCAL_DIR，指向你的本地Meteor源码目录，再启动项目
• 调试时可以在“监视”面板里添加那个出问题的属性，实时查看它的变化，更容易定位什么时候变成了undefined

内容的提问来源于stack exchange，提问作者Fony Fazoulyanov