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. SSM框架+Plupload实现断点续传(Spring+SpringMVC+MyBatis+Plupload)

    关于Plupload的介绍,相信它的官网http://www.plupload.com/已经给得很详细了.Plupload的上传原理简单点说,就是将用户选中的文件(可多个)分隔成一个个小块,依次向服务 ...

  2. Spring MVC注解冲突

    SpringMVC+MyBatis - 7 Spring自动扫描注解类的冲突问题 http://www.blogjava.net/crazycy/archive/2014/07/12/415738.h ...

  3. 【网络流24题】 No.5 圆桌问题 (多重匹配)

    [题意] 假设有来自 n 个不同单位的代表参加一次国 际会议.每个单位的代表数分别为r i ni , = 1,2, .会议餐厅共有 m 张餐桌,每张餐桌可容纳 ci (i = 1,2, , m) 个 ...

  4. CAS单点登录配置[5]:测试与总结

    终于要结束了... 测试 1 我们同时打开Tomcat6和Tomcat7,如果报错请修改. 打 开浏览器,输入http://fighting.com/Client1,进入CAS登录界面,这里我们先输入 ...

  5. 李洪强iOS开发Swift篇---11_变量&常量&元组

    李洪强iOS开发Swift篇---11_变量&常量&元组 说明: 1)终于要写一写swift了.其实早在14年就已经写了swift的部分博客,无奈时过境迁,此时早已不同往昔了.另外,对 ...

  6. [转贴]C++调用openssl 的AES加密例子

    #include <stdio.h>#include <string.h>#include <sys/types.h>#include <sys/stat.h ...

  7. 【Xamarin挖墙脚系列:mac 终端 常用命令+Mac OS X的快捷键+beamoff 】

    原文:[Xamarin挖墙脚系列:mac 终端 常用命令+Mac OS X的快捷键+beamoff ] 基本命令 1.列出文件 ls 参数 目录名        例: 看看驱动目录下有什么:ls /S ...

  8. 消息队列feed程序实现中的问题

    因项目需要, 构建了很多消息队列还排队处理任务, 相应的每个队列也配有一个feed程序来feed消息 一开始很简单地这样做: while (true){ $msg = $query->bPop( ...

  9. VS2013 ASP.NET MVC 修改Web项目的IISExpress的端口固定

    [首先]关闭防火墙,或防火墙开放端口  在解决方案中,右键某项目,属性——Web——服务器——选择IISExpress URL输入:http://localhost:8000/   直接将8000更改 ...

  10. Android优秀开源项目

    本文转自:http://blog.tisa7.com/android_open_source_projects Android优秀开源项目 Android经典的开源项目其实非常多,但是国内的博客总是拿 ...