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. c++ 函数的函数声明

    c++ 函数的函数声明 只要在被调用函数的首部的末尾加一个分号,就成为对该函数的函数声明.函数声明的位置应当在函数调用之前. #include <iostream> using names ...

  2. jQuery制作Web全屏效果

    需要的资源 1.jQuery版本库是必不可少的2.jQuery FullScreen plugin如果你下载不方便的话,你可以直接把下面的代码copy到你本地JQuery FullScreen plu ...

  3. bzoj 3784: 树上的路径 堆维护第k大

    3784: 树上的路径 Time Limit: 10 Sec  Memory Limit: 256 MBSubmit: 88  Solved: 27[Submit][Status][Discuss] ...

  4. Linux find命令详解

    转自Linux find命令详解 一.find 命令格式 1.find命令的一般形式为: find pathname -options [-print -exec -ok ...] 2.find命令的 ...

  5. Wordpress 网站搭建及性能监控方法详解!

    前言 说到 Wordpress,大家往往想到的是博客,其实,如今的 WordPress 已经成为全球使用量最多的开源 CMS 系统.并且,如果你有一定的技术基础稍加改动,就可以搭建出新闻网站.企业网站 ...

  6. 批量建立EXCHANGE邮件帐号建立三部曲

    第一步:从AD里导出用户名(可以基于OU),将输出的CSV的DN列删除,并去除可能的测试及其它用途用户名. csvde -f users-gz.csv -d "ou=MKT gz,dc=xm ...

  7. python邮件收发SAMPLE

    #!/usr/bin/env python # -*- encoding: utf-8 -*- import os, socket from time import localtime, strfti ...

  8. 【网络流24题】 No.6 最长不减子序列问题 (最大流)[模型:最多不相交路径]

    [题意] 给定正整数序列x1 ,x2 , x3... ( 1)计算其最长不减子序列的长度 s.( 2)计算从给定的序列中最多可取出多少个长度为 s 的不减子序列.( 3) 如果允许在取出的序列中多次使 ...

  9. usb.ids

    # # List of USB ID's # # Maintained by Vojtech Pavlik <vojtech@suse.cz> # If you have any new ...

  10. Multi-Die系统介绍

    一个典型的存储系统一般是有几片NAND存储器组成的.一般会使用8-bit的总线,用来将不同的存储器与控制器进行连接,如图2.32所示.一个系统中多片NAND的存储系统可以提高存储容量,同时还可以提高读 ...