Using TypeScript when installing packages from npm often requires you to install related definition files. This lesson shows you how to use typings to install es6-shim then how to configure SystemJS to load from node_modules.

Install:

npm install --save rxjs

Import:

import {Observable} from 'rxjs/Observable';
import 'rxjs/add/observable/interval';

But you will find errors, the reason for that rxjs include es6, but our target is es5.

So, install:

typings install es6-shim --save -ambient

Include:

<script>
System.config({
packages: {
"dist": {
"defaultExtension": "js",
"main": "main"
},
"rxjs": {
"defaultExtension": "js"
}
},
map: {
"lodash": "https://npmcdn.com/lodash@4.13.1",
"rxjs": "node_modules"
}
}); System.import("dist")
</script>

Then you can start using rxjs;

import {Observable} from 'rxjs/Observable';
import 'rxjs/add/observable/interval'; Observable.interval(1000)
.subscribe( x => console.log(x))

[TypeScript] Using Typings and Loading From node_modules的更多相关文章

  1. [TypeScript] Using Lodash in TypeScript with Typings and SystemJS

    One of the most confusing parts of getting started with TypeScript is figuring out how to use all th ...

  2. 在 Typescript 2.0 中使用 @types 类型定义

    在 Typescript 2.0 中使用 @type 类型定义 基于 Typescript 开发的时候,很麻烦的一个问题就是类型定义.导致在编译的时候,经常会看到一连串的找不到类型的提示.解决的方式经 ...

  3. Nodejs生态圈的TypeScript+React

    基于Nodejs生态圈的TypeScript+React开发入门教程   基于Nodejs生态圈的TypeScript+React开发入门教程 概述 本教程旨在为基于Nodejs npm生态圈的前端程 ...

  4. 基于Nodejs生态圈的TypeScript+React开发入门教程

    基于Nodejs生态圈的TypeScript+React开发入门教程   概述 本教程旨在为基于Nodejs npm生态圈的前端程序开发提供入门讲解. Nodejs是什么 Nodejs是一个高性能Ja ...

  5. TypeScript 素描 - 模块解析、声明合并

    模块解析 模块解析有两种方式 相对方式  也就是以/或 ./或-/开头的,比如import jq  from "/jq" 非相对方式  比如 import model  from ...

  6. 搭建typescript开发环境最详细的全过程

    搭建typescript开发示例https://github.com/Microsoft/TypeScriptSamples typescript案例https://www.tslang.cn/sam ...

  7. 在微信小程序开发中使用Typescript

    Typescript的优势咱不需要赘述太多,有兴趣可以参考(https://www.typescriptlang.org/).今天给大家分享一下如何在微信小程序(或者其他同类小程序)开发中使用Type ...

  8. Angular2 从0到1 (一)

    史上最简单Angular2教程,大叔都学会了 作者:王芃 wpcfan@gmail.com 第一节:Angular 2.0 从0到1 (一)第二节:Angular 2.0 从0到1 (二)第三节:An ...

  9. Angular2学习

    1.新建项目 2.新建Model public class TodoItem { public int Id { get; set; } public string Key { get; set; } ...

随机推荐

  1. Forget asp.net membership,ASP.NET Identity Overview

    http://www.asp.net/identity http://www.asp.net/identity/overview/getting-started/introduction-to-asp ...

  2. android开发环境重装系统之后的配置

    前提: 之前配置好的android开发环境:重装系统:压缩了android目录 配置: 安装java环境 安装; 建立JAVA_HOME变量:JAVAHOME添加到path变量 JAVA_HOME=C ...

  3. Dom学习笔记-(一)

    一.概述 DOM(文档对象模型)是针对HTML和XML文档的一个API,其脱胎于DHTML. DOM可以将任意HTML和XML文档描绘成一个由多层节点构成的结构. 每一个文档包含一个根节点-文档节点, ...

  4. A simple test

        博士生课程报告       视觉信息检索技术                 博 士 生:施 智 平 指导老师:史忠植 研究员       中国科学院计算技术研究所   2005年1月   目 ...

  5. WAF

    http://netsecurity.51cto.com/art/201010/231124.htm http://wenku.baidu.com/link?url=elrFtxPRcwJ5FjlXE ...

  6. 基于Spring Boot构建的Spring MVC快速入门

    原文地址:http://tianmaying.com/tutorial/spring-mvc-quickstart 环境准备 一个称手的文本编辑器(例如Vim.Emacs.Sublime Text)或 ...

  7. SPRING IN ACTION 第4版笔记-第三章ADVANCING WIRING-002-激活PROFILE、设置默认值、@ActiveProfiles

    一. Spring honors two separate properties when determining which profiles are active:spring.profiles. ...

  8. 嵌入式C语言不可不用的关键字

    1.static关键字 这个关键字前面也有提到,它的作用是强大的. 要对static关键字深入了解,首先需要掌握标准C程序的组成. 标准C程序一直由下列部分组成: 1)正文段——CPU执行的机器指令部 ...

  9. CentOS下date命令 - 显示和设置系统日期与时间

    显示系统日期 要显示系统日期,只要输入: $ date Thu Dec 5 22:55:41 WIB 2013 格式化显示日期 日期有很多格式.如果你不喜欢默认的格式,你可以换一种格式.你可能会想&q ...

  10. Makefile中include、-include、sinclude的区别

    如果指示符“include”指定的文件不是以斜线开始(绝对路径,如/usr/src/Makefile...),而且当前目录下也不存在此文件:make将根据文件名试图在以下几个目录下查找:首先,查找使用 ...