搭建编译环境
TypeScript 编写的代码是无法直接在js引擎( 浏览器 / Nodejs )中运行的,最终还需要经过编译成js代码才可以正常运行
-
搭建手动编译环境
1️⃣ 全局安装 typescript 包(编译引擎) -> 注册 tsc 命令
npm i -g typescript
2️⃣ 新增 demo.ts文件,执行 tsc demo.ts 命令生成 demo.js 文件
3️⃣ 执行 node demo.js 运行 js 文件查看效果
-
搭建工程化下的自动编译环境
基于工程化的TS开发模式( webpack / vite ),TS 的编译环境已经内置,无需手动安装配置。
npm create vite@latest ts-project-demo -- -- template vanilla-ts
// npm create vite@latest 使用最新版本的 vite 创建项目
// ts-project-demo 项目名称
// -- -- template vanilla-ts 项目使用的模板为原生ts模板
总结:
1️⃣ 浏览器中能直接运行TypeScript代码吗?
不可以,需要编译为js代码再运行
2️⃣ 哪个包可以负责把TS代码编译为JS代码?
typescript
3️⃣ 实际工作中需要我们手动编译代码吗?
不需要,由工程化工具内置,自动编译