原文链接：node-webkit教程(16)调试typescript

本文所讲的内容同样适用于chrome浏览器。

在chrome的开发人员工具的配置项中，有一个sourcemap的选项，用来配置javascript源码和生成代码的关系。如果能在浏览器中直接调试typescript代码，才能让我们真正体会到typescript开发的快乐。

首先打开chrome开发者工具的配置项，然后查看sources下的Enable source maps选项，如果已经选中，请先取消，然后刷新页面，再选中，再刷新页面。

 
此时我们可以在开发这工具的Sources选项中看到ts文件。

如果你是使用visual studio开发typescript 程序，默认项目是自动生成map文件的。在每一个js文件下会有map文件的注释说明。

如果没有生成map文件，到工具下的配置项中，配置typescript就可以了。

现在我们可以在开发者工具中设置断点了。

是不是很happy呢？

ps：nw.js，electron交流群 313717550

node-webkit教程(16)调试typescript的更多相关文章

  1. electron教程(番外篇二): 使用TypeScript版本的electron, VSCode调试TypeScript, TS版本的ESLint

    我的electron教程系列 electron教程(一): electron的安装和项目的创建 electron教程(番外篇一): 开发环境及插件, VSCode调试, ESLint + Google ...

  2. [整理]Node入门 » 一本全面的Node.js教程 - Demo实践所遇到的问题

    花了一个上午看完[转载]Node入门 » 一本全面的Node.js教程 根据里面的Demo自己手动实现过程中还是遇到了些问题,特整理在此. <1>.由于node.msi安装包已经自动添加了 ...

  3. 实用的 Node.js 教程，工具和资源

    这里分享一批实用的实用的 Node.js 教程,工具和资源. Node.js是一个建立在Chrome之上的JavaScript运行时平台,可方便地构建快速,可扩展的网络应用程序.Node.js使用事件 ...

  4. 10+ 最佳的 Node.js 教程和实例

    如果你正在找Node.js的学习资料及指南,那么请继续(阅读),我们的教程将会覆盖即时聊天应用.API服务编写.投票问卷应用.人物投票APP.社交授权. Node.js on Raspberry Pi ...

  5. Node.js 教程 01 - 简介、安装及配置

    系列目录: Node.js 教程 01 - 简介.安装及配置 Node.js 教程 02 - 经典的Hello World Node.js 教程 03 - 创建HTTP服务器 Node.js 教程 0 ...

  6. Node.js 教程 04 - 模块系统

    前言: Node.js的模块系统类似于C/C++的文件引用,可以声明对象,也可以定义类 创建对象. 大家这么理解,就简单了. 定义: 为了让Node.js的文件可以相互调用,Node.js提供了一个简 ...

  7. Node.js教程系列~目录

    Node.js这个东西在近几年火起来了,而且会一直火下去,无论在infoq还是在cnblogs,csdn上,都可以到处看到它的样子,它主推的应该就是异步式I/O 吧,是的,设计的很完美,很吸引人,虽然 ...

  8. chrome浏览器调试typescript

    在chrome的开发人员工具的配置项中,有一个sourcemap的选项,用来配置javascript源码和生成代码的关系. 如果能在浏览器中直接调试typescript代码,才能让我们真正体会到typ ...

  9. iOS10 UI教程视图调试

    iOS10 UI教程视图调试 iOS10 UI教程视图调试,当视图很复杂的时候,层次结构就不会很简单了.Xcode可以通过视图(View)调试帮助开发者解决层次结构复杂的问题.视图调试是在Xcode ...

随机推荐

  1. 正确停止kafka的方法

    kill -15 pid 即: kill SIGNTERM pid 不要使用kill -9. kill -15会触发调用shutdownHook的run方法,从而可以执行关闭服务器的时候一些必要代码. ...

  2. 控件的相对位置与绝对位置-UI界面编辑器(SkinStudio)教程

    绝对位置: 相对位置: 相对位置配合Anchor属性使用 例如Anchor属性选择left|top(即相对位置的left和top保持不变) 窗口大小改变前: 窗口大小改变后: 可以看到控件相对位置的l ...

  3. UART UVM验证平台平台搭建总结

    tb_top是整个UVM验证平台的最顶层:tb_top中例化dut,提供时钟和复位信号,定义接口以及设置driver和monitor的virual interface,在intial中调用run_te ...

  4. C++中四种转换类型的区别

    一.四种转换类型比较: 类型转换有c风格的,当然还有c++风格的.c风格的转换的格式很简单(TYPE)EXPRESSION,但是c风格的类型转换有不少的缺点,有的时候用c风格的转换是不合适的,因为它可 ...

  5. 错误:创建 cachingConfiguration 的配置节处理程序时出错: 未能加载文件或程序集“Microsoft.Practices.EnterpriseLibrary.Caching,

    问题: 错误:创建 cachingConfiguration 的配置节处理程序时出错: 未能加载文件或程序集“Microsoft.Practices.EnterpriseLibrary.Caching ...

  6. expecting SSH2_MSG_KEX_ECDH_REPLY ssh_dispatch_run_fatal问题解决

    设置client的mtu ifconfig eth0 mtu 576 Ultimately, I added the following to /etc/ssh/ssh_config: Host * ...

  7. widows下jieba分词的安装

    在切词的时候使用到jieba分词器,安装如下: 切入到结巴包,执行 python setup.py install 安装后,可以直接在代码中引用: import jieba

  8. linux 下如何安装Telnet ?

    1 如何查看我的linux下是否安装了这个服务?2 没有安装的情况下,如何安装?3 client端 需要安装什么吗? 查看:rpm -qa | grep telnet安装:yum install -y ...

  9. zzulioj 1907小火山的宝藏交易（dfs记忆化搜索）

    #include <stdio.h> #include <algorithm> #include <string.h> #include <vector> ...

  10. 完成了第一个java

    这是我的第一个java程序,求水仙花数2016-04-26  22:39:09