【vscode】如何在vscode 中配置:TypeScript开发node环境
入门流程,大神绕行。
安装环境
这就不多说了,安装开发的环境。
安装vscode
下载地址:https://code.visualstudio.com/
安装Nodejs
下载地址:https://nodejs.org
配置
安装 TypeScript
官网:https://www.typescriptlang.org/
官网上,有文档,有视频,有Demo,隐约记得见过中文站,但是现在怎么都找不到了,找到的同学可以告诉我一下。
用node.js的npm安装TypeScript编译器
npm install -g typescript
安装Tpyings
npm install -g typings
typings 主要是用来获取.d.ts文件。当typescript使用一个外部JavaScript库时,会须要这个文件,当然好多的编译器都用它来增加智能感知能力。
配置项目
创建package.json
建一个目录的文件夹,起一个你喜欢的名字。
node项目嘛,当然要先建立一个package.json
npm init
跟着提示下一步就好了。
创建 tsconfig.json
typescript 的项目都需要一个tsconfig.json
tsc --init
会创建一个这样内容的tsconfig.json
{
"compilerOptions": {
"module": "commonjs",
"target": "es5",
"noImplicitAny": false,
"sourceMap": false
},
"exclude": [
"node_modules"
]
}
因为写node.js你可以修改tagget为es6, 要调试把 sourceMap改为true, 添加allowjs为true,就可以ts和js混合玩了.
{
"compilerOptions": {
"module": "commonjs",
"target": "es6",
"noImplicitAny": false,
"sourceMap": true,
"allowJs": true
},
"exclude": [
"node_modules"
]
}
安装 node 的 .d.ts 库
还是因为是node.js开发,我们要安装node的ts库, 为了强类型,主要还是为了智能感知。
typings install dt~node --global
国内的用typings 的时候,而且就会抽风,好久都完成不了,不要紧,Ctrl+C掉了,再执行,多试几次,总会有成功的时候的。
typings 现在已经不推荐使用了。现在都用npm来弄。
npm install @types/node --dev-save
配置 vscode
打开 vscode
code .
windows话 也可以右键菜单,open with Code.

配置 TypeScript 编译
按ctrl + shift + b, 如果没有配置过,task, 就会在上面提示。

选择【配置任务运行程序】

会在.vscode文件夹下生成一个 task.json, 基本不用动,我到现在是没有改过它。
{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "0.1.0",
"command": "tsc",
"isShellCommand": true,
"args": ["-p", "."],
"showOutput": "silent",
"problemMatcher": "$tsc"
}
小试身手
我们来创建一个app.ts 文件,随便写点东西吧
/**
* person
*/
class person {
constructor() {
}
/**
* print
*/
public print() {
console.log('this is a person')
}
}
let p = new person();
p.print();
按Ctrl+Shift+B,编译一下,就会生成一个app.js.
现在运行试试结果吧。
【vscode】如何在vscode 中配置:TypeScript开发node环境的更多相关文章
- 如何在Eclipse中配置python开发环境
考虑到网上关于Eclipse中配置Python开发环境的文章千篇一律,故写此文以总结. 本文主要内容是:三种Pydev配置方法和一种PyDev卸载方法. 本文的前提是你已经安装了Eclipse和pyt ...
- IDEA中配置Scala开发编译环境
安装JDK 因为Scala是运行在JVM平台上的,所以安装Scala之前要安装JDK. 安装Scala Windows安装Scala编译器 访问Scala官网http://www.scala-lang ...
- 如何在Pycharm中配置Python和Django(环境搭建篇)
一.准备好以下必备条件,并且按照先后顺序进行安装: Python 3.6 (64-bit).或Python27(64-bit) Django-1.11.tar.gz pycharm 开发工具 安装好了 ...
- 如何在appconfig中配置服务的ip
开发了一个WindowsService消息服务器,刚开始一直都是在代码中把IP地址写死,所以每次只要是更换了新的IP地址后,都需要重新编译项目.所以考虑把ip配置到config文件中, 这样做的好处是 ...
- VC 6中配置OpenGL开发环境
2010,2012中配置类似 http://hi.baidu.com/yanzi52351/item/f9a600dffa4caa4ddcf9be1d VC 6中配置OpenGL开发环境 这里,我习惯 ...
- 如何在sharepoint2010中配置Google Anlytics 分析服务
简介 Google Analytics(分析)不仅可以帮助您衡量销售与转化情况,而且能为您提供新鲜的深入信息,帮助您了解访问者如何使用您的网站,他们如何到达您的网站,以及您可以如何吸引他们不断回访 ...
- eclipse中配置c++开发环境 Eclipse + CDT + MinGW
转自eclipse中配置c++开发环境 Eclipse + CDT + MinGW 基本框架:Eclipse + CDT + MinGW 背景知识: CDT:CDT 是完全用 Java 实现的开放源码 ...
- 如何在Eclipse中配置Tomcat(免安装版)
如何在Eclipse中配置Tomcat(免安装版) 2013-10-09 23:19wgelgrsh | 分类:JAVA相关 | 浏览642次 分享到: 2013-10-10 17:10提问者采纳 ...
- Visual Studio Code中配置GO开发环境
在Visual Studio Code中配置GO开发环境 一.GO语言安装 详情查看:GO语言下载.安装.配置 二.GoLang插件介绍 对于Visual Studio Code开发工具,有一款优秀的 ...
随机推荐
- iOS判断数组不为空
用([array count]==0 )来判断是否为空,都是坑,如果array为空的话,执行count就会直接报错,程序崩溃退出. 正确判断NSArray是否为空的方法: if(array != ni ...
- Oracle数据库迁移到AWS云的方案
当前云已经成为常态,越来越多的企业希望使用云来增加基础设施的弹性.减轻基础设施的维护压力,运维的成本等.很多企业使用云碰到的难题之一是如何将现有的应用迁移到云上,将现有应用的中间件系统.Web系统及其 ...
- 图解VMware内存机制
在写<VMware内存机制初探>之后,原本是计划写一篇<VMware内存机制再探>的,讲一讲VMware内存机制中的另外几个重要内容,比如透明内存共享(TPS, Transpa ...
- 微信公众账号开发之N个坑(一)
我这人干活没有前奏,喜欢直接开始.完了,宝宝已经被你们带污了.. 微信公众账号开发文档,官方版(https://mp.weixin.qq.com/wiki),相信我,我已经无力吐槽写这个文档的人了,我 ...
- page、pageContext、servletContext的区别
ServletContext是容器上下文,指当前的一个web应用的上下文 JSP网页本身,page对象是当前页面转换后的Servlet类的实例.从转换后的Servlet类的代码中,可以看到这种关系:O ...
- the fifth class
1.实际比背景长,怎么做到的? 2个父级一个做头背景一个做尾背景 2.2层,每次自带背景上下是覆盖关系,如何做到 2层?,子浮动 3.标签 4.border可覆盖:margin-bottom 为负 ...
- [django]在virtualenv下安装的第三方库的使用方法
在virtualenv下安装的第三方库,例如south, requests等,如果想在django中使用,需要先将库添加到settings.py的INSTALLED_APPS中, 以south, re ...
- 转:Xms Xmx PermSize MaxPermSize 区别
Eclipse崩溃,错误提示:MyEclipse has detected that less than 5% of the 64MB of Perm Gen (Non-heap memory) sp ...
- max min 与 min max 的差别
在求解最优化问题时,遇到一个对偶问题的转换:对于形如 的问题,可以转换为求解 即原问题的对偶问题.而在一般情况下: 对于这个为题的说明我参照http://math.stackexchange.com/ ...
- 【fortify】安全漏洞的分类
https://vulncat.hpefod.com/zh-cn 下面摘要著名的软件安全专家Gary Mc Graw的2006年的新书<Software Security building se ...