Chrome和VSCode进行联调

调试之前要找到Chrome的快捷方式,对属性进行以下配置,添加remote-debugging-port=9222
tips:注意前面有一个空格。
Chrome和VSCode进行联调

  1. 首先在左侧扩展中搜索Debugger for Chrome并点击安装:
  2. 点击Run>start Debbugging(或者选择F5),选择下拉按钮,会有一个添加,选择chrome
  3. 之后会出现laungh.json的配置文件在自己的项目目录下面
    Chrome和VSCode进行联调
    进行如上配置,“file”是一个笨方法,每次调试不同的文件时都需要更改相应的路劲,由于才开始学习,等我研究归来,在学习最佳方法。

初次调试过程中遇到此Bug,解决方法:

.vscode中的settings.json试试改成以下这个,报错应该是vscode升级导致的问题 {
“git.ignoreLimitWarning”: true,
“debug.javascript.usePreview”:false }

Chrome和VSCode进行联调
Chrome和VSCode进行联调
当vscode底部呈现绿色,且新打开一个chrome网页,你就可以开始调试啦。

推荐一篇很不错的博文,他列举了几种前端进行调试的方法;
点击前往