1、首先在VSCode 上装一个插件:Debugger for Chrome
如下图所示:在搜索框中输入Debugger for Chrome 然后点击安装
2、配置文件
依次点击图中所示按钮,然后出现launch.json文件,在里面添加配置信息
配置信息如下:
{
// 使用 IntelliSense 了解相关属性。
// 悬停以查看现有属性的描述。
// 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}"
}
]
}
3.开启本地服务器
3.1 打开VS Code,然后点击查看 => 调试控制台或者直接按快捷键 ctrl+shift+y调出控制面板,点击“终端”,在里面直接输入
npm install -g live-server
3.2 安装完成后会出现live-server的版本信息,表示安装成功
3.3 在终端输入:live-server会出现下面的信息
然后直接在浏览器弹出的界面
至此,就可以在本地开启服务器进行调试了