WebStorm--配置并运行TypeScript项目

原文网址:WebStorm--配置并运行TypeScript项目-CSDN博客

简介

本文介绍WebStorm如何配置并运行TypeScript项目。

为简单起见,以下用TS代表TypeScript。

1.安装node.js

可以直接安装node.js或者使用nvm安装node.js

2.安装TS编译器(非必须)

场景1:默认情况

WebStorm已经自带了TS编译器,如下图所示:

场景2:Vue里引入了typescript

此时WebStorm自动选择为引入的版本:

场景3:下载自己想要的TS编译器

方法如下

1.安装

复制代码
npm install typescript -g

2.查看安装结果(查看版本)

复制代码
tsc -v

如下图所示,则表示安装成功。

安装后,可以在WebStorm里选择它:

3.安装TS-Node

复制代码
npm install -g ts-node

查看安装结果

复制代码
ts-node -v

4.安装TS插件

在WebStorm里安装TS插件:

5.新建项目

新建空项目

创建完后,右键项目,新建TS文件

创建完后,在demo.ts文件里写TS代码:

TypeScript 复制代码
var a:string = "Hello World"
console.log(a)

6.运行TS代码

右键demo.ts文件,点击Run 'demo.ts'或者"Debug 'demo.ts'

结果:

相关推荐
flash俊杰8 小时前
Zod Schema 驱动的 IPC 契约:从入参校验到状态机一致性的三层防御
javascript·typescript
愛芳芳14 小时前
基于 Electron + Vue3 的仿 PC 微信客户端项目实战
前端·javascript·css·elementui·typescript·electron·vue
神秘的猪头1 天前
TypeScript 高级用法全解析:从泛型到 infer,把类型系统真正用起来
前端·typescript
FYKJ_20102 天前
【毕设分享】基于Web的校园兼职信息发布与申请系统07059
前端·vue.js·spring boot·mysql·typescript·spark·课程设计
ynchyong2 天前
TS 基础
typescript·ts
西瓜太郎4992 天前
别再手算 Token 成本:用 React 状态机做一个可追溯的模型费用计算器
react.js·typescript
右耳朵猫AI3 天前
Web前端周刊2026W37 | Shopify 转原生、React 编译 Rust 化、Vitest 5.0、Rslib 1.0
前端·javascript·react.js·typescript·node.js
晚安日记wanna3 天前
TS const 类型参数一道面试题的四层追问
前端·面试·typescript
掰头战士3 天前
你说你折这玩意干什么-agent工作的核心,还真得好好考虑怎么折叠上下文
typescript·llm·agent
ynchyong3 天前
VUE 中 不能将类型“R[]”分配给类型“UnwrapRefSimple<R>[]”
typescript·vue·ts·unwraprefsimple