如何从'Rx`导入`Observable`(非角度)

Question

我正在使用SystemJS将我的es2015项目加载到浏览器中.

这就是我做的

import {Observable} from 'rxjs/Rx';

const button = document.querySelector('button');
const start$ = Observable.fromEvent(button, 'click');

在这种情况下Observable是undefined.所以我试过了

import Observable from 'rxjs/Observable';

在这种情况下Observable是一个对象,但Observable.fromEvent是undefined(它似乎是一个空对象)

最后我做到了

import Rx from 'rxjs/Rx' // Rx.Observable

哪个做了.任何想法为什么其他两个不起作用？我见过他们使用过的代码.什么是首选导入方式Observable？

更新:如下所述,它在README中描述.但是,如果我这样做

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

const start$ = Observable.fromEvent(startButton, 'click');

我得到的Observable是undefined.如果我这样做

import Observable from 'rxjs/Observable';

这又Observable是一个空对象.在fromEvent不添加.

我正在使用RxJs 5.1.1,这是我的index.html/systemjs部分:

 <script src="./node_modules/systemjs/dist/system.js"></script>
  <script>
      SystemJS.config({
          baseURL: 'node_modules',
          packages: {
              '.': {
                  defaultJSExtensions: 'js'
              }
          },
          map: {
              'plugin-babel': 'systemjs-plugin-babel/plugin-babel.js',
              'systemjs-babel-build': 'systemjs-plugin-babel/systemjs-babel-browser.js'
          },
          transpiler: 'plugin-babel'
      });

      SystemJS.import('/js/main.js');
  </script>

Answer 1

正如自述文件中所述，您可以使用import { Observable } from 'rxjs/Observable';：

通过修补仅导入您需要的内容（这对于大小敏感的捆绑很有用）

这为您提供了一个非常小的Observable，您需要向其中显式添加您计划使用的任何额外功能；对于您的情况，请遵循以下内容：

import 'rxjs/add/observable/fromEvent';