如何从`Rx`(非角度)导入`Observable` [英] How to import `Observable` from `Rx` (not angular)
问题描述
我正在使用 SystemJS 将我的 es2015 项目加载到浏览器中.
I'm using SystemJS to load my es2015 project into the browser.
这是我做的
import {Observable} from 'rxjs/Rx';
const button = document.querySelector('button');
const start$ = Observable.fromEvent(button, 'click');
在这种情况下,Observable
是 undefined
.所以我尝试了
In this case Observable
is undefined
. So I tried
import Observable from 'rxjs/Observable';
在这种情况下 Observable
是一个对象但 Observable.fromEvent
是 undefined
(它似乎是一个空对象)
In which case Observable
is an object but Observable.fromEvent
is undefined
(it seems to be an empty object)
我终于做到了
import Rx from 'rxjs/Rx' // Rx.Observable
确实有效.任何想法为什么其他两个不起作用?我看过他们使用这些的代码.导入 Observable
的首选方法是什么?
which did work. Any ideas why the other two didn't work? I have seen code in which they used these. What would be the preferred way to import Observable
?
更新:如下所述,自述文件中对所有内容进行了描述.但是如果我这样做
UPDATE: As stated below its all described in the README. However if I do that
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/fromEvent';
const start$ = Observable.fromEvent(startButton, 'click');
我得到 Observable
是 undefined
.如果我这样做
I get Observable
is undefined
. And if I do
import Observable from 'rxjs/Observable';
Observable
又是一个空对象.fromEvent
未添加.
the Observable
is an empty object again. The fromEvent
is not added.
我使用的是 RxJs 5.1.1,这是我的 index.html/systemjs 部分:
I'm using RxJs 5.1.1 and here is my index.html/systemjs part:
<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>
推荐答案
As it notes 在 README 中,您可以使用 import { Observable } from 'rxjs/Observable';
:
As it notes in the README, you can use import { Observable } from 'rxjs/Observable';
:
通过修补仅导入您需要的内容(这对于大小敏感的捆绑很有用)
To import only what you need by patching (this is useful for size-sensitive bundling)
这为您提供了一个非常小的Observable
,您需要在其中明确添加您计划使用的任何额外功能;在您的情况下,请按照以下方式操作:
This gives you a very minimal Observable
, to which you need to explicitly add any extra functionality you plan to use; in your case, follow it with:
import 'rxjs/add/observable/fromEvent';
这篇关于如何从`Rx`(非角度)导入`Observable`的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!