Type Error: observable.of is not a function - angular-cli@1.6.3 - rxjs@5.5.x - angular5

Question

After upgrading to angular-cli@1.6.3 and converting all the RxJS imports, methods, and operators to the new >5.5 form, I get a type error at run-time saying that Observable.of is not a function. The same error happens with all the methods that are defined as a member of an extension of Observable, for example, Observable.fromEvent.

On the other hand, the methods that are defined as stand alone functions, like Observable.combineLatest run properly despite the compiler warns that them don't exists on type Observable.

Just to clarify, I had no problems with any operator (after converting them to the pipe form). Only with methods.

The solution I found was to replace:

import { of } from 'rxjs/observable/of';
import { fromEvent } from 'rxjs/observable/fromEvent';
...
const x = Observable.of(true, false);
const y = Observable.fromEvent(target, 'click');

with

import { ArrayObservable } from 'rxjs/observable/ArrayObservable';
import { FromEventObservable } from 'rxjs/observable/FromEventObservable';
...
const x = ArrayObservable.of(true, false);
const y = FromEventObservable.create(target, 'click');

But I think it should be a better way. Am I right?

---

Notes:

1. I am forced to use "Ahead Of Time compilation" feature to build and serve the app because otherwise the angular injector would fail (but that is another question).
2. I'm am aware of the existence of this other similar question. But that one applies to versions of RxJS less than < 5.5 according to the answer.

3. ng --version gives:

   Angular CLI: 1.6.3, Node: 8.9.1, OS: win32 x64, Angular: 5.1.3,

   @angular/cli: 1.6.3, @angular-devkit/build-optimizer: 0.0.36, @angular-devkit/core: 0.0.22, @angular-devkit/schematics: 0.0.42, @ngtools/json-schema: 1.1.0, @ngtools/webpack: 1.9.3, @schematics/angular: 0.1.11, @schematics/schematics: 0.0.11, typescript: 2.5.3, webpack: 3.10.0,

Answer 1

When using lettable (now known as pipeable) operators and factory functions, those are just functions, not methods of Observables. So it should just be

import { of } from 'rxjs/observable/of';
import { fromEvent } from 'rxjs/observable/fromEvent';

const x = of(true, false);
const y = fromEvent(target, 'click');

See how the documentation uses the range factory function.