步骤：

  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. Docker守护式容器的创建和登录

    创建守护式容器 如果对于一个需要长期运行的容器来说,我们可以创建一个守护式容器(后台运行的容器). 创建(-d)并运行(-i)守护式容器命令如下(容器名称不能重复): docker run -id - ...

  2. nroff - 用 groff 模拟 nroff 命令

    总览 (SYNOPSIS) nroff [ -h ] [ -i ] [ -mname ] [ -nnum ] [ -olist ] [ -rcn ] [ -Tname ] [ file... ] 描述 ...

  3. 关于<input type="hidden"/>标签的记录

    <input type="hidden" name="pid" value="10"/>标签放在一个input标签后可以使用,但 ...

  4. Linux学习--第三天--linux文件目录、ls、mkdir、mv、rm、touch、cat、tac、more、less、head、tail、ln、chmod、chown、chgrp、umask

    文件目录 目录名 备注 bin 下面的命令所有人都可以运行 sbin 只有root才能运行,s代表super /mnt,/media,/misc 都是挂载目录,但一般只用mnt /opt 第三方软件安 ...

  5. tflite

    1.编译libtensorflow-lite.a库: ubuntu下交叉环境编译: https://blog.csdn.net/computerme/article/details/80345065 ...

  6. 10年前文章_eclipse下perl环境搭建

    eclipse下perl环境搭建1．Eclipse下安装perl插件Help -Software Updates…- Available .- Add Site… :http://e-p-i-c ...

  7. set -xv

    1.set -x 或set xtrace 会显示+以及脚本中的内容(执行的部分,没执行的不显示) set -xv(脚本中所有的内容都显示,包括没执行的部分) 2.debug=3   //多层级调试 t ...

  8. sshfs 挂载远程文件夹

    1 安装 # yum install sshfs # dnf + releases] $ sudo apt-get install sshfs [On Debian/Ubuntu based syst ...

  9. python文件读写详解

    # Python3 open(file, mode='r', buffering=-1, encoding=None, errors=None, newline=None, closefd=True, ...

  10. Zookeeper学习笔记(下)

    这是ZK学习笔记的下篇, 主要希望可以分享一些 ZK 的应用以及其应用原理 我本人的学习告一段落, 不过还遗留了一些ZK相关的任务开发和性能测试的任务, 留待以后完成之后再通过其他文章来进行分享了 Z ...