.ts 文件编译成 .js 文件，以及 VSCode 自动编译配置

一、手动编译

• 创建了一个 test.ts 文件，想要将它编译成 .js 文件，执行下面命令：

  # 编译后会得到一个 test.js 文件
  $ tsc test.ts
  

• 还可以指定版本进行编译，下面以 ES5 举例，想要将现有的 .ts 文件编译成 ES5 版本的 .js 文件，则可以通过 --target 某版本 进行指定版本编译，不指定默认一般是当前开发环境支持的最高版本。

  # 编译后会得到一个 ES5 版本的 test.js 文件
  $ tsc --target ES5 test.ts
  

二、自动编译配置

1、生成 tsconfig.json 配置文件，找到项目根目录执行初始化命令，会指定创建好配置文件：

$ tsc --init

2、调整 tsconfig.json 配置（其他配置有注释，自己根据情况选择）：

"outDir": "./js", /* 把 ts 文件编译完成后放在 js 文件目录中，没有会自动创建。 */
"strict": false,  /* 是否使用严格模式，默认是 true，看个人习惯 */

3、启动监视任务：

• VSCode 编辑器顶部菜单中找到：终端 -> 运行任务 -> 弹出窗口中点击 显示所有任务 -> 点击启动 tsc: 监视 - tsconfig.json。

• 然后就会进入自动监视编译状态，如果去新建或者已存在的 .ts 文件会被自动编译后放在 ./js 文件夹中，直接引用 js 文件夹中的 .js 文件即可，每次调整 .ts 代码保存后也会被自动编译。

• 如果想要停止监视，在顶部菜单中找到：终端 -> 终止任务 -> 点击终止 tsc: 监视 - tsconfig.json

代码007普通

打赏 收藏 海报 链接