Nhập khẩu Góc và RxJS

Question

Tôi luôn biết nhập các toán tử Observable riêng của mình để giới hạn thời gian tải. Tuy nhiên tôi đã nhận thấy một cái gì đó ngày hôm nay mà tôi hy vọng ai đó có thể xin vui lòng giải thích cho tôi.

Tôi đang sử dụng IntelliJ/WebStorm với Webpack.

Hãy nói rằng trên một trang trong ngOnInit của tôi, tôi có một cuộc gọi http:

ngOnInit() { 
     this.http.get('https//:google.com').map(e => e); 
} 

Nếu tôi không nhập khẩu các nhà khai thác bản đồ biên dịch sẽ phàn nàn, vì vậy tôi nhập nó như thế này:

import 'rxjs/add/operator/map'; 

Tất cả đều tốt trên thế giới. Cho đến khi tôi cần phải sử dụng một Observable. Vì vậy, tôi sẽ thêm một.

ngOnInit() { 
     let test = Observable.create(subscriber => { 
      return null; 
     }); 

     this.http.get('https//:google.com').map(e => e); 
} 

Bây giờ trình biên dịch hiểu phàn nàn rằng nó không thể tìm thấy Quan sát, vì vậy tôi có được IntelliJ/WebStorm nhập khẩu nó cho tôi và cho biết thêm này ở phía trên cùng của tập tin của tôi:

import {Observable} from 'rxjs'; 

Tất cả là tốt một lần nữa . Tuy nhiên, lần nhập mới này dường như làm cho việc nhập bản đồ không liên quan. Những gì tôi có nghĩa là, nếu tôi có thể ngưng việc nhập khẩu bản đồ và chỉ để lại một trong những quan sát ở, tất cả các biên dịch tốt ...

Tuy nhiên, nếu tôi chỉ định nhập khẩu Quan sát như thế này:

import {Observable} from 'rxjs/Observable'; 

Sau đó, tôi phải thêm lại quá trình nhập cho nhà điều hành bản đồ ...

Tôi có nhập tất cả RxJS khi tôi nhập Quan sát như thế này không?

import {Observable} from 'rxjs'; 

Nếu có, làm cách nào tôi có thể yêu cầu IntelliJ không làm điều đó và chỉ nhập lớp học?

Answer 1

Tại sao không có tệp (ví dụ: rxjs-extensions.ts) với các tiện ích và toán tử lớp có thể quan sát được của rxjs?

// Observable class extensions 
import 'rxjs/add/observable/throw'; 

// Observable operators 
import 'rxjs/add/operator/do'; 
import 'rxjs/add/operator/filter'; 
import 'rxjs/add/operator/map'; 

Và sau đó trong mô-đun chính của bạn (app.module.ts ex) nhập khẩu từ tập tin này:

import './rxjs-extensions'; 

Và trong thành phần chính của bạn (ví dụ: app.component.ts) chỉ nhập Observavle :

import { Observable } from 'rxjs/Rx'; 

Đây là cách nó được đề cập đến trong hướng dẫn góc chính.

Answer 2

Bạn có thể sử dụng tất cả các nhà khai thác bằng cách sử dụng này:

import * as Rx from "rxjs/Rx"; 

Rx.Observable.of(1,2,3,4,5); 

Answer 3

Bắt đầu từ WebStorm 2016,3 (Tôi tin), bạn có một lựa chọn vào danh sách đen nhập khẩu nhất định.Editor > Code Style > StypeScript

Do not import exactly from: [rxjs] 

Bên cạnh đó, có một lá cờ có sẵn trong tslint để cấm nhập khẩu toàn cầu:

{ 
    "rules": { 
    "import-blacklist": [true, "rxjs"] 
    } 
}