知用网
白蓝主题五 · 清爽阅读
首页  > 电脑技巧

TypeScript安装方法详解,前端开发一步到位

想在项目里用 TypeScript,第一步当然是装好环境。很多人一开始被卡住,其实只要会用 npm,整个过程几分钟就能搞定。

确认开发环境

TypeScript 依赖 Node.js 环境,所以先打开命令行,输入下面这行看看有没有返回版本号:

node -v

如果提示“command not found”,那就得先去官网下载安装 Node.js。装好了再回来继续。

全局安装 TypeScript

在命令行里执行这条命令:

npm install -g typescript

加了 -g 是为了全局安装,这样你随便进哪个项目都能用 tsc 命令。装完之后跑一下:

tsc --version

能看到类似 Version 5.2.2 的输出,说明已经装上了。

在项目中局部安装(推荐)

实际开发中更常见的做法是每个项目单独装一遍,避免版本冲突。进入你的项目目录:

cd my-project
npm init -y
npm install --save-dev typescript

这样 TypeScript 就只存在当前项目的 node_modules 里,配合 package.json 锁定版本,团队协作更稳。

简单试个例子

新建一个 hello.ts 文件:

const greet: string = "Hello, TypeScript!";
console.log(greet);

然后在命令行运行:

tsc hello.ts

会生成一个 hello.js 文件,里面就是编译后的 JavaScript 代码。直接用 node hello.js 就能运行。

顺便配个 tsconfig.json

想让项目支持更多 TS 特性,比如自动识别文件、设置编译选项,可以初始化一个配置文件:

tsc --init

会生成 tsconfig.json,默认配置就够大多数项目用了。以后只要运行 tsc,它就会按这个文件的规则编译整个项目。

装 TypeScript 其实不难,就像装个编辑器插件一样简单。关键是在动手过程中熟悉流程,下次搭新项目手都不带抖的。