首先安装扩展调试插件debugger for chrome

点击瓢虫按钮，进行调试项目的配置，点击配置按钮

选择Chrome环境，

会弹出Chrome调试配置文件launch.json，修改下端口即可。

若是没有lauch.json配置文件产生，也可以通过以下方式进行配置文件的打开。选择添加配置

再选择Chrome：Launch，修改下端口即可

打开项目，通过ctrl+`【注意该`为Tab键上的`】输入ng serve启动项目。

切换到瓢虫界面，比如我们在app.component.ts里头设置了一个断点，

启动调试按钮，会自动弹出浏览器页面

刷新页面之后，会发现，程序运行到，断点位置。

我们可以进行变量的查看，异常捕获，调用堆栈等调试。

Visual Studio Code如何调试代码的更多相关文章

  1. Mac上使用Visual Studio Code开发/调试.NET Core代码

    Mac上使用Visual Studio Code开发/调试.NET Core代码 .Net Core 1.0终于发布了,Core的一大卖点就是跨平台.这个跨平台不只是跨平台运行,而且可以跨平台开发.今 ...

  2. SharePoint Framework 在Visual Studio Code中调试你的本地解决方案

    博客地址:http://blog.csdn.net/FoxDave Visual Studio Code不知道大家都有没有,界面清爽,编辑快速,是一个非常好的前端开发工具.本文介绍如何使用Goog ...

  3. 如何用Visual Studio Code远程调试运行在服务器上的nodejs应用

    假设我有一个nodejs应用,运行在AWS - 亚马逊云平台上(Amazone Web Service).我想用本地的Visual Studio Code来远程调试服务器端的nodejs应用. Vis ...

  4. 在Mac上使用Visual Studio Code开发/调试.NET Core代码

    .Net Core 1.0终于发布了,Core的一大卖点就是跨平台.这个跨平台不只是跨平台运行,而且可以跨平台开发.今天抽空研究了下在Mac下如何使用VS Code来开发.NET Core程序,并且调 ...

  5. visual studio code 里调试运行 Python代码

    最近对微软的visual studio code 挺感兴趣的,微软的跨平台开发工具.轻量简洁. 版本迭代的也挺快的,截止16年8月2日已经1.3.1版本了,功能也愈加完善.(16年12月18日 已经, ...

  6. SharePoint Framework 在Visual Studio Code中调试你的托管解决方案

    博客地址:http://blog.csdn.net/FoxDave 上一篇介绍了如何在本地调试你的SharePoint Framework解决方案,本篇介绍如何调试你的SharePoint Onl ...

  7. [翻译]使用Visual Studio Code怎样调试Rust

    我将 Visual Studio Code 作为Rust首选编辑器.遗憾的是 VS Code 不能非常好地完成 Rust 的调试. 配置调试器不难,但仍然需要几个步骤.我已经完整配置了好几次.我正在写 ...

  8. Visual Studio Code 添加设置代码段(snippet)

    从VSCode发布以来就在关注,最近已经更新到版本0.10.8,已经支持了插件功能.日常使用编辑器已经由Sublime Text迁移到了VSCode.使用中遇到了这个问题,在网上也没搜到解决方案.记录 ...

  9. Visual Studio Code 写Python 代码

    最近在博客园新闻里面看到微软发布的Visual Studio Code 挺好用的,现在在学习Python,查看官网发布的VSCode 是支持Python代码,自己试着安装用一下,下面是我的安装以及配置 ...

随机推荐

  1. Spring_Bean 之间的关系

    beans-relation.xml <?xml version="1.0" encoding="UTF-8"?><beans xmlns=& ...

  2. import和import static的区别

    import static静态导入是JDK1.5中的新特性. 一般我们导入一个类都用 import 包名.类名; 而静态导入是这样:import static 包名.类名.*; 这里的多了个stati ...

  3. RabbitMQ 之 WorkQueues工作队列

    模型图 为什么会出现 work queues? 前提:使用 simple 队列的时候 (上一篇博客)我们应用程序在是使用消息系统的时候,一般生产者 P 生产消息是毫不费力的(发送消息即可),而消费者接 ...

  4. SpannableString实现TextView的链接效果

    SpannableString实现TextView的链接效果 一.简介 TextView使用SpannableString设置复合文本TextView通常用来显示普通文本,但是有时候需要对其中某些文本 ...

  5. WPF的外观装饰类——Border

    public class Border : System.Windows.Controls.Decorator 说明:在另一个元素的周围绘制边框.背景或同时绘制二者.

  6. MVC3;0问题与知识点

        1.    代码中@Html.BeginForm不对,应 @using(Html.BeginForm){}   2.   不设置 注解 required属性中的 errormessage,则错 ...

  7. fiddler之使用教程(一)

    一. 什么是fiddler&它可以做什么 fiddler是位于客户端和服务器端的HTTP代理,也是目前最常用的http抓包工具之一.它能够记录客户端和服务器之间的所有HTTP请求,可以针对特定 ...

  8. git一个系列教程

    https://git-scm.com/book/zh/v1/%E8%B5%B7%E6%AD%A5-%E5%85%B3%E4%BA%8E%E7%89%88%E6%9C%AC%E6%8E%A7%E5%8 ...

  9. 教你如何使用node.js制作代理服务器

    var http=require("http"); var url=require("url"); var server=http.createServer(f ...

  10. 通过ISBN获取豆瓣详细书籍资料

    手里有四十几万的图书馆书籍的isbn编号,通过isbn去请求豆瓣书籍的详细资料. # -*- coding: utf-8 -*- # @Time : 18-10-2 下午10:27 # @Author ...