首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >TypeScript 开发环境搭建

TypeScript 开发环境搭建

原创
作者头像
Emperor_LawD
修改2021-05-13 18:11:41
9590
修改2021-05-13 18:11:41
举报
文章被收录于专栏:LawD的技术专栏LawD的技术专栏

下载 node.js

node.js 官网
node.js 官网

安装 node.js

  • 无其他特殊操作,选择好安装路径直接安装即可
  • 安装完成后,使用win+R快捷键打开 cmd 命令行窗口,并输入node -v检查是否安装成功
出现以上版本号,则表示安装成功
出现以上版本号,则表示安装成功

安装解析 TS 的工具包

  • 进入 cmd 命令行窗口
    • 网速好
      • 输入:npm install -g typescript
        • npm:包管理器
        • typescript:就是用来解析 TS 的工具包,提供了 tsc 命令,实现了 TS -> JS
    • 网速不好
      • 先输入:npm config set registry https://registry.npm.taobao.org(淘宝镜像)
      • 检查:npm config get registry
      • 再输入:npm install -g typescript
安装完成
安装完成
  • 检查是否安装成功
    • 输入tsc,如果出现一堆代码则安装成功
安装成功
安装成功

方式一:使用记事本进行编写

  • 新建记事本文件
  • 输入以下代码
console.log('Hello TS')
  • 保存并修改扩展名为 .ts
  • 进入命令行,输入 tsc 文件名.ts
  • 即可将 ts 文件转换为 js 文件
txt编写typescript
txt编写typescript

方式二:使用 VScode 进行编写

  • 打开VScode,新建文件夹
  • 打开终端,输入 tsc --init,引入 ts 编译规则配置文件 tsconfig.json
  • 在 tsconfig.json 文件中修改 "outDir": "./""outDir": "./dist" ,并取消注释
"outDir": "./"  /*outDir用来指定输出文件夹,值为一个文件夹路径字符串,输出的文件都将放置在这个文件夹*/
  • 新建文件,文件命名为 hello.ts
  • 输入以下代码
console.log('Hello TS')
  • 点击菜单栏 -> 终端 -> 运行任务 -> 选择当前文件夹 -> tsc 监视 即可
  • 打开监视可实现实时更新 js 文件
VScode编写typescript
VScode编写typescript

方式三:使用 WebStorm 进行编写

  • 打开webStorm,新建目录,新建 ts 文件
  • 输入以下代码
console.log('Hello TS')
  • 点击左下角 Terminal 输入 tsc 文件名.ts
  • 即可将 ts 文件转换为 js 文件
WebStorm编写typescript
WebStorm编写typescript

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 下载 node.js
  • 安装 node.js
  • 安装解析 TS 的工具包
  • 方式一:使用记事本进行编写
  • 方式二:使用 VScode 进行编写
  • 方式三:使用 WebStorm 进行编写
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档