首先,先在扩展里找到一个叫做Debugger for Chrome的插件,微软官方出品的。把它安装上
然后你需要有一个Chrome浏览器,这个就不赘述了
然后在你的项目里建一个.vscode的目录,在这个目录下建立一个launch.json的文件
然后把代码粘贴进去
这个代码在这里:
{
"version": "0.2.0",
"configurations": [{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome",
"url": "http://localhost:3000",
"sourceMaps": true,
"webRoot": "${workspaceFolder}",
"skipFiles": [
"node_modules/**"
],
"sourceMapPathOverrides": {
"webpack:///*": "${webRoot}/*"
}
}],
}
然后你还像往常那样启动项目,但是自动弹出的chrome把它关掉,咱们不用那个
在这里咱们用调试菜单的“启动调试”命令
然后你就可以愉快的打断点调试了,不要再console.log了~ ^_^