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'

结果:

相关推荐
SHeqSpMeS14 小时前
基于A* 算法的无人机三维路径规划:MATLAB实现之旅
webstorm
Dragon Wu20 小时前
Electron Forge集成React Typescript完整步骤
前端·javascript·react.js·typescript·electron·reactjs
We་ct1 天前
LeetCode 56. 合并区间:区间重叠问题的核心解法与代码解析
前端·算法·leetcode·typescript
程序猿阿伟2 天前
《TypeScript中Protobuf到运行时类型安全的转换指南》
javascript·安全·typescript
We་ct2 天前
LeetCode 228. 汇总区间:解题思路+代码详解
前端·算法·leetcode·typescript
阿蒙Amon2 天前
TypeScript学习-第10章:模块与命名空间
学习·ubuntu·typescript
VT.馒头2 天前
【力扣】2695. 包装数组
前端·javascript·算法·leetcode·职场和发展·typescript
AAA阿giao3 天前
从零拆解一个 React + TypeScript 的 TodoList:模块化、数据流与工程实践
前端·react.js·ui·typescript·前端框架
hedley(●'◡'●)3 天前
基于cesium和vue的大疆司空模仿程序
前端·javascript·vue.js·python·typescript·无人机
百锦再3 天前
Vue高阶知识:利用 defineModel 特性开发搜索组件组合
前端·vue.js·学习·flutter·typescript·前端框架