使用VS Code调试TypeScript游戏程序JsTankGame成功!!!
TypeScript游戏程序JsTankGame不是本人写的,是从CSDN下载的。
JsTankGame是用Visual Studio开发的,因此在Visual Studio下调试非常顺畅。本人尝试用Visual Studio Code看看能否调试这个用TypeScript写的游戏程序。
首先解压JsTankGame到JsTankGameforVSCode文件夹下,启动Visual Studio Code,打开JsTankGameforVSCode文件夹,如下图:。

需要配置settings.json如下:
{
"typescript.tsdk": "node_modules/typescript/lib"
}
浏览器也不正常:

配置好settings.json后,按F5进入调试运行,但出现2个错误提示:“[debugger-for-chrome] Cannot connect to the target: connect ECONNREFUSED 127.0.0.1:9222”和“未指向有效的 tsserver 安装。将禁用 TypeScript 语言功能”,如下图:


如上的提示告诉我们运行TypeScript程序启动Web 服务器,因此,需要先安装Web 服务器(live-server)。
下载并安装Web 服务器:
1、下载Web 服务器,在cmd命令下输入:npm install -g live-server
2、启动Web 服务器,在cmd命令下输入:live-server

启动Web 服务器(live-server)后再按F5进入调试:

JsTankGame终于在Visual Studio Code中调试成功了!!!
参考资料
使用VS Code调试TypeScript游戏程序JsTankGame成功!!!的更多相关文章
- 使用Visual Studio Code开发(编译、调试)C++程序
总体安装步骤 安装VSC(Visual Studio Code). 安装C/C++编译器(如MinGW-w64),然后配置好环境变量.//完成这步即可在VSC的终端(命令行)下编译.运行.cpp程序了 ...
- VS Code 调试 Angular 和 TypeScript 的配置
一.安装插件 在 Visual Studio Code 中打开扩展面板(快捷键 Ctrl+Shift+X),搜索安装 Debugger for chrome 插件). 二.配置启动参数 在 Visua ...
- 使用Visual Studio Code搭建TypeScript开发环境
使用Visual Studio Code搭建TypeScript开发环境 1.TypeScript是干什么的 ? TypeScript是由微软Anders Hejlsberg(安德斯·海尔斯伯格,也是 ...
- VS Code 运行 TypeScript 操作指南
总结一下TypeScript开发环境用到的各种工具: Node——通过npm安装TypeScript及大量依赖包.从https://nodejs.org/下载并安装它:如果安装各种包不方便,可以将安装 ...
- electron教程(番外篇二): 使用TypeScript版本的electron, VSCode调试TypeScript, TS版本的ESLint
我的electron教程系列 electron教程(一): electron的安装和项目的创建 electron教程(番外篇一): 开发环境及插件, VSCode调试, ESLint + Google ...
- VS Code开发TypeScript
TypeScript是JaveScript的超集,为JavaScript增加了很多特性,它可以编译成纯JavaScript在浏览器上运行.TypeScript已经成为各种流行框架和前端应用开发的首选. ...
- chrome浏览器调试typescript
在chrome的开发人员工具的配置项中,有一个sourcemap的选项,用来配置javascript源码和生成代码的关系. 如果能在浏览器中直接调试typescript代码,才能让我们真正体会到typ ...
- 在Chrome+Visual Studio中调试asp.net程序很慢的问题(Firefox也有类似问题)
在Chrome+Visual Studio中调试asp.net程序很慢的问题(Firefox也有类似问题) 今天开始起在Chrome中调试,发现问题主要出在菜单栏(layout文件)中,google了 ...
- Eclipse+CDT+GDB调试android NDK程序(转)
Eclipse+CDT+gdb调试android ndk程序 先介绍一下开发环境,在这个环境下,up主保证是没有问题的. ubuntu 11.10 eclipse 3.7(indego) for ja ...
随机推荐
- Helloworld和程序员人生
转:Helloworld和程序员人生 高中时期 10 PRINT "HELLO WORLD" 20 END 大学新生 program Hello(input, output) be ...
- 汇编test和cmp区别
来自http://tunps.com/assembly-test-and-cmp 看过破解教程,都知道test,cmp是比较关键,可是我一直不清楚它们究竟是怎么比较的,最后下决心找了很多资料,和大家一 ...
- 史上最全的css hack
<!DOCTYPE html> <html> <head> <title>Css Hack</title> <style> #t ...
- SQL中对日期进行模糊查询的方法
在我们通过SQL语句对数据库中的数据进行查询时,难免会遇到针对datetime的查询,但是因为一般情况下,输入的时间条件为年月日,所以,这种情况下,我们就要进行一下模糊查询,首先,摒弃一种投机取巧的方 ...
- Js自动截取字符串长度,添加省略号“……”
JavaScript字符串处理函数,根据定义的长度截取字符串,超出部分裁掉追加……,很多时候网页上显示的内容需要缩成“...”该方法用于处理字符串显示固定长度,超长部分用“...”代替: /**参数说 ...
- github 提交时候提示 org.eclipse.jgit.errors.ObjectWritingException: Unable to create new object: /usr/local/apache243/ht
只需要执行 chmod -R 777 ./* 把 .git文件权限设置为 777便可以实现.
- 为Linux服务器伪装上Windows系统假象
网络上的计算机很容易被黑客利用工具或其它手段进行扫描,以寻找系统中的漏洞,然后再针对漏洞进行攻击. 通过伪装Linux系统,给黑客设置系统假象,可以加大黑客对系统的分析难度,引诱他们步入歧途,从而进一 ...
- PE文件结构整理
一直想做一个PE结构的总结,只是学的时候有很多东西就没搞懂,加上时间一长,很多知识也早忘了,也就一直没完成.这几天从头看了下,好不容易理清楚了,整理一下,以免又忘了 pe文件框架结构,图片贴过来太模糊 ...
- 三种实现PHP伪静态页面的方法(转)
PHP伪静态写法--其一 伪静态又名:URL重写 以下列举了三种方法. 方法一: 比如这个网页 http://www.2cto.com /soft.php/1,100,8630.html 其实处理的脚 ...
- iOS开发——C篇&动态内存分配
再C语言中关于内存是一个很重要的知识点,所以今天我就从c语言的内存分配开始为大家解析一下C语言再iOS开发中非常重要的一些知识. 1:malloc函数的介绍 C语言中开辟内存空间:malloc函数 再 ...