vscode调试angular2

调试步骤：

1.安装nodejs

2.安装vscode

3.vscode安装debugger for chrome插件

4.选择调试->打开调试配置，选择chrome配置，打开lauch.json,修改如下：

{"version": "0.2.0","configurations": [{"type": "chrome","request": "launch","name": "Launch Chrome against localhost","url": "http://localhost:4200","webRoot": "${workspaceRoot}"}]
}

5.启动项目:npm start

6.vscode打开app.component.ts组件,在app.component.ts的constructor函数中设置断点，在自动打开的浏览器中刷新页面(http://localhost:4200)，vscode自动停止断点位置。

7.在vscode的调试控制台中输入this.title,查看组件的变量值

转载于:https://www.cnblogs.com/ihzeng/p/10440645.html

vscode调试angular2相关推荐

使用 vscode 调试前端代码
使用 vscode 调试前端代码今天我们以webpack项目为基础讲解配置复制代码 1. 安装插件 Debugger for Chrome 2. 修改 config/index.js 将devto ...
(004)RN开发VSCode调试ReactNative项目
1. 添加配置文件点击小蜘蛛后,按第一步.第二步操作即可接着选择调试平台☑️下面四个.点击OK,会生成一个launch.json文件并打开. 2. 添加断点接下来,我们回到DEDUG,点击右边的 ...
使用vscode调试Nodejs
之前想用vscode调试nodejs,总是不成功,也走很多弯路,现在记录下来. 首先新建一个文件夹,用vscode打开这个文件夹, 用vscode自带的终端执行npm init,输入名称,其他的可不输 ...
ubuntu下vscode调试开发踩过的坑
最近刚过安装了中文版的ubuntu18.04.1,安装完之后想在ubuntu上安装vscode做c/c++的开发调试,踩了不少坑,在此记录一下,希望大家在这条路上不要再踩同样的坑. 1.安装vscod ...
vscode 调试_如何使用VSCode调试JS？
更多精彩,请点击上方蓝字关注我们! 序言做前端开发的朋友经常需要使用Visual Studio Code编辑代码,很多朋友就想在VSCode调试JS代码,下面我们就介绍下如何配置操作. 一.环境准备 ...
VSCode 调试 Egg 完美版 - 进化史 #25
VSCode 调试 Egg 完美版 - 进化史 #25 背景 VSCode 早期版本,对 Node Cluster 的调试支持一直不是很友好,譬如: 开发期重启进程后,不支持重新 attach. Cl ...
Mac 配置vscode调试PHP
Mac系统版本:MacOS Mojave 10.14.5 vscode:1.36.0 MacOS Mojave 10.14.5 系统自带 PHP 7.1.23 1.开启php sudo vim / ...
vscode 调试.net core 2.0 输出乱码解决方法
vscode 调试.net core 2.0 输出乱码解决方法参考文章: (1)vscode 调试.net core 2.0 输出乱码解决方法 (2)https://www.cnblogs.com/ ...
.Net Core新建解决方案，添加项目引用，使用VSCode调试
.Net Core新建解决方案,添加项目引用,使用VSCode调试参考文章: (1).Net Core新建解决方案,添加项目引用,使用VSCode调试 (2)https://www.cnblogs. ...

vscode调试angular2

vscode调试angular2相关推荐

最新文章

热门文章