教育行业A股IPO第一股(股票代码 003032)

全国咨询/投诉热线:400-618-4000

VSCode调试TS代码配置教程

更新时间:2021年03月18日11时29分 来源:传智教育

好口碑IT培训


VSCode调试TS代码配置方法
配置步骤

    VSCode调试TS代码是需要配置的。下面介绍配置步骤

1第一步准备要调试的ts文件
新建 a.ts 文件,作为要调试的ts文件
console.log('1 准备开始执行 for 循环')

for (let i: number = 1; i <= 3; i++) {
  console.log('...一锅装不下')
}

console.log('2 for 循环执行结束')
 

1610345280893_VSCode调试ts.png

2第二步 打开调试窗口:点击左侧活动栏倒数第二个按钮(Debug)

生成默认配置:点击DEBUG后面的下拉框,选择添加配置

修改配置内容如下:

{
  // 使用 IntelliSense 了解相关属性。 
  // 悬停以查看现有属性的描述。
  // 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "调试TS代码",
      // ts-node 命令: “直接”运行ts代码。
      // 作用:调试时加载ts-node包(在调试时“直接”运行ts代码)
      "runtimeArgs": ["-r", "ts-node/register"],
      // 此处的 a.ts 表示要调试的 TS 文件( 可修改为其他要调试的ts文件 )
      "args": ["${workspaceFolder}/a.ts"]
    }
  ]
}

3第三步安装调试用到的包

在当前目录中,打开终端窗口

在终端中输入以下命令:

# 注意:原来通过 -g(全局)安装的包,在调试时不生效,需要在当前目录中单独安装
# 调试TS代码,依赖这两个包
npm i ts-node typescript


调试技巧

查看 console.log 输出(调试控制台)

监视变量的值(1.鼠标移入;2.添加到左侧监视窗口)

点击查看更多

猜你喜欢

Javascript基础入门视频教程

Flexbox布局有什么特点?

如何通过JS实现深拷贝?

JS中修改this指向的方法有哪些?

黑马程序员web前端培训课程

0 分享到:
和我们在线交谈!