【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开发工具,有一款优秀的 ...
随机推荐
- Java 压缩字符串
1.引言 最近在做项目中,平台提供一个http服务给其他系统调用,然后我接收到其他系统的json格式的报文后去解析,然后用拿到的数据去调用corba服务,我再把corba的返回值封装完成json字符串 ...
- 2-5. Working with Compile Time Constants
#include <array> #include <cstdint> #include <iostream> class MyClass { private: u ...
- 一起买beta版PHP单元测试
一起买beta版PHP单元测试 测试目的 保证代码质量,对各个单元进行测试,可以有效地保证代码的可靠性,让模块在与别的模块整合时出现更少的错误. 单元描述 完成帖子接口 将"正在进行&q ...
- app开发遇到问题及解决
1:ios and Android 差异input type=text 当用户点击input框时,弹出手机键盘,ios会遮挡输入框 解决办法: pswOnFocus = function(){ tar ...
- Oracle统计函数之Lead
一,Lead 语法及例子 Lead函数是十分的好用的一个函数.它的语法如下图: 简单地说,lead是个奇特函数,在允许不使用自连接的情况下,一次返回多行. 参数说明: value_expr 值表达式, ...
- 多层嵌套ajax同步
方式一: $.ajax({ type : "post", url : "user/add", data : data, async : false, //必须为 ...
- Backbone.js
Backbone.js是一套JavaScript框架與RESTful JSON的應用程式介面.也是一套大致上符合MVC架構的編程範型.Backbone.js以輕量為特色,只需依賴一套Javascrip ...
- 转载:java 中对类中的属性使用set/get方法的意义和用法
经常看到有朋友提到类似:对类中的属性使用set/get方法的作用?理论的回答当然是封闭性之类的,但是这样对我们有什么作用呢?为什么要这样设计?我直接使用属性名来访问不是更直接,代码更简洁明了吗?下面我 ...
- adb unknown host service 这个问题的解决,转载
一直没搞明白这个问题咋出现的,但今天看到一个方法,搞定了!原来是豌豆荚占用了 5037 端口导致. 参见原文章:一个豌豆荚引发的血案——关于ADB server didn't ACK的问题 简单来讲, ...
- 快手 KSCAD 5.0 矢量图形设计软件
今天我的快手软件发布了一个最新版本 KSCAD 5.0,免费使用, 详情请看 www.timegis.com 快手 5.0 (KSCAD) 是一款简单易用的矢量绘图软件,其功能和Visio类似,可以绘 ...