typescript的执行/调试

849 阅读1分钟

执行

tsc编译后执行

tsc a.ts #生成a.js
node a.js #运行生成的js

ts-node直接执行

ts-node a.ts

webstorm下最方便的ts调试方法:

  1. 全局安装ts-node
  2. tsconfig.json中支持sourcemap
  3. 安装webstorm的Run Configuration for TypeScript 插件
{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "sourceMap": true,
    "rootDirs": [
      "src"
    ]
  },
}

vscode中调试ts

准备tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "outDir": "out",
    "sourceMap": true
  }
}

生成launch.json

左侧边栏-> Run and Debug->Create launch.json->选择 Node.js

此步骤检测到tsconfig.json之后, 会生成如下launch.json配置文件

"preLaunchTask": "tsc: build - tsconfig.json",

安装typescript

npm install -g typescript

此步骤主要是为了安装tsc

坑点:

简体中文插件的一个冲突

如果安装了简体中文语言包"Chinese Simpified" 会导致任务名称 是 "tsc : 构建 - tsconfig.json" 这个时候会提示错误. 手动将 preLaunchTask改为如下就可:

"preLaunchTask": "tsc: 构建 - tsconfig.json",

git bash的冲突

如果将git bash作为自己默认的 terminal, 调试也会报错, 因为git bash 识别不了 D:/xxx/xxx.ts 这种路径.

解决方案: 用回 windows 命令行

其它执行调试过程中遇到的问题

experimentalDecorators报错:

Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option in your 'tsconfig' or 'jsconfig' to remove this warning.

{
  "compilerOptions": {
    "experimentalDecorators": true
  }
}

Cannot find module 'fs' or its corresponding type declarations.

此错误是因为ts不能直接调用node的js库, 所以必须要通过 @types解决, 执行 npm install @types/node 安装node的types即可.

Cannot find name 'console'. Do you need to change your target library?

// 方法一: 如果是node应用
npm install @types/node --save-dev

// 方法二: 如果是浏览器类应用 tsconfig.json中设置
{
  compilerOptions:{
      lib: [ "dom"]
  }
}