icon 2.0.0-alpha.5 breaks my rxjs

[PostImpatica]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

rxjs should't crash

What is the current behavior?

@angular/icon@2.0.0-alpha.5 breaks rxjs BehaviorSubject and Observable

What are the steps to reproduce?

install icon v alpha 4 and it works, install icon v alpha 5 and it breaks every time. It took me forever uninstalling and installing the different material design modules between version 4 & 5 until i narrowed it down to the "icon" package. all the other packages work great on alpha 5, it's just the "icon" package that causes my build to crash.

Providing a Plunker (or similar) is the best way to get the team to see your issue.
I can't create a plunker because i have no idea how to put Angular2-material core and icon into plunker, i can't find a CDN for version 2.0.0-alpha.5.

Which versions of Angular, Material, OS, browsers are affected?

i'm using the latest Angular rc1 and I just updated my rxjs from beta 5 to 8 but the issue still occurs.

here is the error:

webpack: bundle is now VALID. [default] Checking started in a separate process... [default] /Users/smp/Projects/pts/src/app/services/responsive.service.ts:11:31 Property 'pluck' does not exist on type 'BehaviorSubject<{ height: number; width: number; }>'. [default] /Users/smp/Projects/pts/src/app/services/responsive.service.ts:12:32 Property 'pluck' does not exist on type 'BehaviorSubject<{ height: number; width: number; }>'. [default] /Users/smp/Projects/pts/src/app/services/responsive.service.ts:13:16 Property 'fromEvent' does not exist on type 'typeof Observable'.

here is my service, all it does is allow me to do something when screen size changes:

import { Injectable } from '@angular/core'
import {Observable} from 'rxjs/Observable';
import {BehaviorSubject} from 'rxjs/BehaviorSubject';

@Injectable()
export class ResponsiveService {
  width$: Observable<any>;
  height$: Observable<any>;
  constructor () {
    let windowSize$ = new BehaviorSubject(getWindowSize());
    this.width$ = windowSize$.pluck('width').distinctUntilChanged();
    this.height$ = windowSize$.pluck('height').distinctUntilChanged();
    Observable.fromEvent(window, 'resize')
      .map(getWindowSize)
      .subscribe(windowSize$);
  }
}

function getWindowSize() {
  return {
    height: window.innerHeight,
    width: window.innerWidth
  };
}

[jelbourn]

@robwormald would you know anything about this? Without doing any investigation, I'm guessing it has something to do with being more specific with the rxjs imports (#431), since it was the only real change to icon since the last release.

[clydin]

The ResponsiveService code sample shown above doesn't import the rxjs operators it is using (pluck/distinctUntilChanged/fromEvent).
Adding imports for these should solve the issue:
import 'rxjs/add/operator/pluck';
import 'rxjs/add/operator/distinctUntilChanged';
import 'rxjs/add/observable/fromEvent';

[jelbourn]

@clydin Ah, good observation. @helzgate that should do it.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}