vscode 配置调试环境（内部调试+远程调试）
vscode 开发vue时，以前为了懒，直接利用浏览器的F12来进行调试，但每次找代码的具体位置比较繁琐，还是要遵循标准的调试方式。
1、首先安装vscode的扩展控件Debugger for Chrome
2、配置调试参数
在vscode左侧的目录树中打开调试窗口，在打开的窗口中点击 小齿轮样式的设置 按钮，然后选择 chrome, 然后选择要调试的项目，我这里选择hy3d，VS Code 将会在工作区hy3d根目录生成.vscode 目录，里面会有一个 launch.json 文件并会自动打开
vscode 有两种方式配置，一种是内部调试，会自动打开一个新的google浏览器调试窗口（关闭窗口会结束调试），一种是远程调试google浏览器。这里都介绍一下。
A:内部调试
1） launch.json 文件内容如下，rquest为 launch，注意，这里的webRoot为项目中代码的实际位置（我这里的代码是在我的项目的子文件夹src目录下，所以webRoot为“${workspaceFolder}/src”），不然无法进入断点，内部调试需要配置项目url，即为项目开发调试过程中的本地路径（本项目为hy3d的npm run serve后本地的访问路径）
2）在vscode项目中添加断点，在终端中npm run serve 运行项目
3）点击调试窗口中的绿色的调试按钮，会自动弹出一个google的页面，并且自动进入断点
B:远程调试
1） launch.json 文件内容如下，rquest为 attach，注意，这里的webRoot为项目中代码的实际位置（我这里的代码是在我的项目的子文件夹src目录下，所以webRoot为“${workspaceFolder}/src”），不然无法进入断点
{
// 使用 IntelliSense 了解相关属性。
// 悬停以查看现有属性的描述。
// 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "attach",
"name": "Attach to Chrome",
"port": 9222,
"timeout": 100000,
"webRoot": "${workspaceFolder}/src"
}
]
}
2）配置google浏览器启动属性
在google浏览器程序或快捷键右键，点击属性，打开属性设置窗口，在目标中加上 --remote-debugging-port=9222
3）在vscode项目中添加断点，在终端中npm run serve 运行项目，点击调试窗口中的绿色的调试按钮
4）重新打开google浏览器，输入第三步中的localhost：9989,系统会自动进入断点调试模式，这种模式不影响新标签项的使用。
