codecamp

WebStrom + TypeScript

背景

最近公司用 TypeScript 开发前端。虽然我负责后台的工作,但也需为前端提供意见,为了不盲目提意见,因此来简单了解下 TypeScript

安装配置环境

1. 安装 node.js 

    TypeScript 是在 node.js 的环境上,node.js 下载地址:https://nodejs.org/en/download/

2. 安装 TypeScript 

    使用 Node 的 npm 命令安装 TypeScript 编译器,在 cmd 界面里输入:

npm install typescript -g

    可通过 tsc 命令查看是否安装成功

tsc -v

3. 安装 WebStrom

    WebStrom 官方下载地址: https://www.jetbrains.com/webstorm/ 

WebStorm 自动编译 TypeScript

下载的 2018.1.5 版本的 WebStorm 已经提供自动编译的功能了,只是需要设置一下。 

File -> setting


如果不勾选此项,在代码发生变动时,会有提示,是否要编译


我这边选择了自动编译功能,下面就去尝试第一份代码吧

测试

创建空项目:TypeScriptProgram

File -> New -> Project 



右键此项目,创建 tsconfig.json File



添加 ts 文件





function greeter(person) {
    return "Hello, " + person;
}

let user = "Jane User";

document.body.innerHTML = greeter(user);



保存后,自动生成相应的 js 文件


到此,用 WebStrom 开发 TypeScript 的环境已准备好了。



linux 查看系统开机时间
IPV4 IPV6 正则验证表达式
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }