调试步骤:

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,查看组件的变量值

vscode调试angular2的更多相关文章

  1. VSCode调试go

    VSCode调试go语言出现:exec: "gcc": executable file not found in %PATH%   1.问题描述 由于安装VS15 Preview ...

  2. 【转】vscode调试运行c#详细操作过程

    [转]vscode调试运行c#详细操作过程 主要命令: //路径跳转cd //新建项目dotnet new console -o 路径 //运行dotnet run //用于发布exe<Runt ...

  3. Vscode调试C的多文件工程配置

    关于Vscode的C语言的单文件调试,可以参见VScode调试C语言的设置(win10,Linux),里面已经说明基本的配置和使用. 下面说明一下如何调试多个文件的工程,首先写一个简单的工程,其中工程 ...

  4. vscode 调试node.js

    在开发的过程中,几乎不可能一次性就能写出毫无破绽的程序,断点调试代码是一个普遍的需求. 作为前端开发工程师,以往我们开发的JavaScript程序都运行在浏览器端,利用Chrome提供的开发者工具就可 ...

  5. 使用VSCode调试单个PHP文件

    突然发现是可以使用 VSCode 调试单个 PHP 文件的,今天之前一直没有弄成功,还以为 VSCode 是不能调试单文件呢.这里记录一下今天这个"突然发现"的过程. 开始,是在看 ...

  6. vscode调试js,安装了nodejs之后还出现无法在Path上找到运行时的node

    vscode 调试js,安装了nodejs之后还出现无法在Path上找到运行时的node. 重启vscode解决

  7. Vscode 调试 C 语言时数组值无法显示的问题

    使用 Vscode 的 Gdb 扩展调试 C 语言时,发现数组变量在 变量列表里面中显示为指针,且只显示为其第一个元素的值,无法看到所有元素的值. 如图所示: 解决: 假设有一个元素个数为10的数组v ...

  8. vscode调试pomelo和pomelo使用vscode调试

    使用vscode 通过端口remote attach进行调试 pomelo. 0. 网上好多调试pomelo的都是webstorm.或者vscode调试node的教程.但没找到vscode调试pome ...

  9. vscode调试html文件

    1. vscode调试html文件 1.1. 使用Debugger for Chrome进行调试 1.1.1. 基于本地file配置方式调试 1.1.2. 基于服务端配置方式调试 1.1.2.1. 启 ...

随机推荐

  1. tableView 顶部多出一部分解决方法

    1.self.automaticallyAdjustsScrollViewInsets = NO; 此方法解决之后 不能保证tableView 能彻底的滑动到底部 2. self.edgesForEx ...

  2. JavaScript编程艺术-第7章代码汇总(1)

    1.document.write()(HTML与JS未分离) HTML: JS: 2..innerHTML(直接覆盖) HTML: JS: 3.getAttribute.setAttribute.ge ...

  3. 【react-native】持续踩坑总结

    陆陆续续的已经接触了RN快3个月,整体的感受...感觉在调试兼容andorid问题的时候就像回到了IE时代. 本来想按自己踩坑的路径持续更新一些记录,但是,现实是坑太多,还是统一写一篇汇总一下吧(鉴于 ...

  4. [POI2012]Vouchers

    Description 考虑正整数集合,现在有n组人依次来取数,假设第i组来了x人,他们每个取的数一定是x的倍数,并且是还剩下的最小的x个. 正整数中有m个数被标成了幸运数,问有哪些人取到了幸运数. ...

  5. 题解报告:hdu 1166 敌兵布阵(线段树or树状数组)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1166 Problem Description C国的死对头A国这段时间正在进行军事演习,所以C国间谍头 ...

  6. string.Format 中不能包含{}字符串

    string scss = @"<style type=""text/css""> body{ margin-left: {0}px; m ...

  7. 3、InputStream

    package com.io.file; import java.io.File; import java.io.FileInputStream; import java.io.FileNotFoun ...

  8. Linux oraenv Tips

    Linux for the Oracle DBA -Customizing the Oracle User's Environment There are many ways to customize ...

  9. commons-lang常用工具类StringEscapeUtils使用--转

    https://my.oschina.net/ydsakyclguozi/blog/341496 在apache commons-lang(2.3以上版本)中为我们提供了一个方便做转义的工具类,主要是 ...

  10. DEV—【GridControl添加按钮列】

    效果图 打开GridControl的Run Designer在左侧栏中找到: 添加一个ButtonEdit: 更改属性中的值:Caption为按钮上显示的Text:Kind为按钮的类型: 然后拖到最后 ...