步骤:

  1. 在构建工具(webpack、gulp 等)的配置中开启生成 source map
  2. 将 VSCode 配置中的debug.allowBreakpointsEverywhere设置为true(重要!这个选项默认是false

现在就可以愉快得在源码上下断点了。

参见:Can set break points in the Visual Studio Code debugger for Typescript, but not for other languages that compile to JavaScript · Issue #41937 · Microsoft/vscode

Visual Studio Code - 在 JS 源码(TS、压缩前代码)上使用断点的更多相关文章

  1. MySql轻松入门系列——第二站 使用visual studio 对mysql进行源码级调试

    一:背景 1. 讲故事 上一篇说了mysql的架构图,很多同学反馈说不过瘾,毕竟还是听我讲故事,那这篇就来说一说怎么利用visual studio 对 mysql进行源码级调试,毕竟源码面前,不谈隐私 ...

  2. 【Visual Studio Code 】使用Visual Studio Code + Node.js搭建TypeScript开发环境

    1.准备工作 Node.js Node.js - Official Site Visual Studio Code Visual Studio Code - Official Site 安装Node. ...

  3. 使用Visual Studio Code + Node.js搭建TypeScript开发环境

    Visual Studio Code搭建Typescript开发环境 —— 相关文章: http://www.cnblogs.com/sunjie9606/p/5945540.html [注意:这里仅 ...

  4. Visual Studio调试到OpenCV源码中

    TL;DR VS2015下,build-farm/vs2015-x64/bin/Debug/目录,*.pdb文件,都拷贝到install/x64/vc14/bin目录,就可以调试进去opencv源码了 ...

  5. [转]Node.js tutorial in Visual Studio Code

    本文转自:https://code.visualstudio.com/docs/nodejs/nodejs-tutorial Node.js tutorial in Visual Studio Cod ...

  6. 用 Visual Studio Code 调试 Node.js

    环境: Visual Studio Code  Node.js 1. 关闭运行中的程序 2.打开入口文件,我这里的入口文件为 app.js 3.点击左侧菜单栏的 debug 按钮 4.点击运行按钮 5 ...

  7. 使用Visual Studio Code搭建TypeScript开发环境

    使用Visual Studio Code搭建TypeScript开发环境 1.TypeScript是干什么的 ? TypeScript是由微软Anders Hejlsberg(安德斯·海尔斯伯格,也是 ...

  8. 在Visual Studio Code中开发Office Add-in

    作者:陈希章 发表于 2017年7月13日 上一篇 我介绍了如何在Visual Studio中开发Office Add-in,因为有标准的项目模板,一系列配套的工具,尤其是自带的一键调试功能,可以让开 ...

  9. Visual Studio Code + live-server编辑和浏览HTML网页

    第一步: 安装Visual Studio Code + Node.JS 第二步:通过如下命令行安装live-server npm install -g live-server 第三步:打开Visual ...

随机推荐

  1. loli的测试-2018.12.9

    模拟赛-2018.12.9 这是NOIP之后第一次模拟赛...但是考的比较悲惨. 非常喜欢写考试总结,不知道为什么... T1:https://www.luogu.org/problemnew/sho ...

  2. Codeforces - 1202D - Print a 1337-string... - 构造

    https://codeforces.com/contest/1202/problem/D 当时想的构造是中间两个3,然后前后的1和7组合出n,问题就是n假如是有一个比较大的质数因子或者它本身就是质数 ...

  3. 破解mysql

    https://blog.csdn.net/lian_easel/article/details/78734240 破解mysql

  4. 探索ASP.Net Core 3.0系列二:聊聊ASP.Net Core 3.0 中的Startup.cs

    原文:探索ASP.Net Core 3.0系列二:聊聊ASP.Net Core 3.0 中的Startup.cs 前言:.NET Core 3.0 SDK包含比以前版本更多的现成模板. 在本文中,我将 ...

  5. 【学习总结】快速上手Linux玩转典型应用-目录

    内容链接 慕课网:快速上手Linux玩转典型应用 目录 第1章-课程介绍 第2章-linux简介 第3章-CentOS的安装 第4章-准备工作 第5章-远程连接SSH专题 第6章-linux常用命令讲 ...

  6. PHP7.2 、git、swoole安装

    一.安装php 1.安装gcc yum -y install gcc gcc-c++ 2.安装一些库 yum -y install php-mcrypt libmcrypt-devel libxml2 ...

  7. 富文本编辑器Ueditor

    一.大概使用: 官网:http://ueditor.baidu.com/website/download.html 使用:[参考index.html] 3.1 引入ueditor的js <scr ...

  8. MySQL中Innodb的聚簇索引和非聚簇索引

    聚簇索引 数据库表的索引从数据存储方式上可以分为聚簇索引和非聚簇索引(又叫二级索引)两种.Innodb的聚簇索引在同一个B-Tree中保存了索引列和具体的数据,在聚簇索引中,实际的数据保存在叶子页中, ...

  9. Spring基础18——通过注解配置bean之间的关联关系

    1.组件装配 <context:component-scan>元素还会自动注册AutowiredAnnotaionBeanPostProcessor实例,这是一个bean的后置处理器,该实 ...

  10. mirror - 映射在远端节点上的档案

    总览 SYNOPSIS mirror [flags] -gsite:pathname mirror [flags] [package-files] 描述 DESCRIPTION Mirror 是以 P ...