前言
调试源码也不是第一次了,每次都煞费苦心去clone代码,然后再翻出打包文件修改source-map。
近日,突然间打通了任督二脉,发觉其实完全可以用vsc调试,比起chrome那可就是鸟枪换炮……心疼抱住傻了多年的自己。
开始
-
下载 Debugger for Chrome
如图 - 创建调试配置
-
点击左边那个debugger的虫子
-
然后选添加配置
展开选添加配置
选这个
- 配置文件
.vscode/launch.json
{
// 使用 IntelliSense 了解相关属性。
// 悬停以查看现有属性的描述。
// 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "Launch Chrome",
"request": "launch",
"type": "pwa-chrome",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}"
}
]
}
- 修改源码的引用路径,以redux为例
- 把
package.json
的module
改成src/index.js
node_modules -
在想调试的地方打上断点
-
启动调试程序
THE END