• 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成功!!!的更多相关文章

  1. 使用Visual Studio Code开发(编译、调试)C++程序

    总体安装步骤 安装VSC(Visual Studio Code). 安装C/C++编译器(如MinGW-w64),然后配置好环境变量.//完成这步即可在VSC的终端(命令行)下编译.运行.cpp程序了 ...

  2. VS Code 调试 Angular 和 TypeScript 的配置

    一.安装插件 在 Visual Studio Code 中打开扩展面板(快捷键 Ctrl+Shift+X),搜索安装 Debugger for chrome 插件). 二.配置启动参数 在 Visua ...

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

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

  4. VS Code 运行 TypeScript 操作指南

    总结一下TypeScript开发环境用到的各种工具: Node——通过npm安装TypeScript及大量依赖包.从https://nodejs.org/下载并安装它:如果安装各种包不方便,可以将安装 ...

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

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

  6. VS Code开发TypeScript

    TypeScript是JaveScript的超集,为JavaScript增加了很多特性,它可以编译成纯JavaScript在浏览器上运行.TypeScript已经成为各种流行框架和前端应用开发的首选. ...

  7. chrome浏览器调试typescript

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

  8. 在Chrome+Visual Studio中调试asp.net程序很慢的问题(Firefox也有类似问题)

    在Chrome+Visual Studio中调试asp.net程序很慢的问题(Firefox也有类似问题) 今天开始起在Chrome中调试,发现问题主要出在菜单栏(layout文件)中,google了 ...

  9. Eclipse+CDT+GDB调试android NDK程序(转)

    Eclipse+CDT+gdb调试android ndk程序 先介绍一下开发环境,在这个环境下,up主保证是没有问题的. ubuntu 11.10 eclipse 3.7(indego) for ja ...

随机推荐

  1. Oracle Union All 排序

    在oracle中使用union all或者 union 对两个结果集进行并集操作时,如果需要对查询结果集进行排序时,不能直接在后面加order by + 表字段 来排序 例如: 在oracle的soc ...

  2. jquery中的html()、text()、val()的区别

      1.html(),text(),val()三种方法都是用来读取选定元素的内容: html()是用来读取元素的HTML内容(包括其Html标签),text()用来读取元素的纯文本内容,包括其后代元素 ...

  3. WDCP安装memcached

    memcached安装 我们打开Web控制面板的时候其实memcached是没有安装的,所以我们要手动安装这个组件. 首先是要下载安装源代码并执行. 1 2 wget -c http://down.w ...

  4. PHPCMSV9 更改后台地址

    修改PHPCMS v9默认后台登录地址 1.修改admin.php文件名,并修改跳转地址写上完整路径2.修改 /phpcms/modules/admin/classes/index.php,把 pub ...

  5. 类似a:hover的伪类的注解

    a:link { font-size: 14pt; text-decoration: underline; color: blue; } /*设置a对象在未被访问前的样式表属性 .*/ a:hover ...

  6. Python 改变当前工作目录

    在shell里编辑: import os os.getcwd()   #取得当前工作目录 os.chdir(r'目标目录')   # os.chdir(r'd:\learnpy')

  7. SJA1000寄存器设置

    在设置CAN控制器SJA1000的输出控制寄存器(OCR)时,由于电路图中只用到了TX0和RX0,所以只考虑OCTP0,OCTN0,OCPOL0.这里设置成了010.然后查了一下配置的表,如下所示: ...

  8. Vector3.Dot 与Vector3.Cross

    Vector3.Dot(点积) : 点积的计算方式为:  a·b=|a|·|b|cos<a,b>; 其中<a,b>和<b,a> 夹角不分顺序; 物理学中点积用来计算 ...

  9. Android Timer的使用

    1:服务端使用PHP <?php echo date('Y-m-d H:i:s'); ?> 2:activity_main.xml <RelativeLayout xmlns:and ...

  10. 设计模式 ( 十六 ): Mediator中介者模式 -- 行为型

    1.概述 在面向对象的软件设计与开发过程中,根据“单一职责原则”,我们应该尽量将对象细化,使其只负责或呈现单一的职责,即将行为分布到各个对象中. 对于一个模块或者系统,可能由很多对象构成,而且这些对象 ...