Search code examples
typescriptangularrxjssystemjsjspm

Why does tsc (Typescript Compiler) ignore RxJS import?


I have setup my Angular2 project using JSPM and SystemJS. I try to import RxJS and a few operators in my boot.ts file but my import does NOT get transpiled into the boot.js output. So

// boot.ts
import {Observable} from 'rxjs/Observable'
import 'rxjs/add/operator/debounceTime'
...

as outlined here: https://github.com/ReactiveX/RxJS#es6-via-npm ends up as

// boot.js
System.register(['rxjs/add/operator/debounceTime', ...

tsc (tried with 1.7.5 and 1.8.0):

// tsconfig.json
{
  "compilerOptions": {
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": true,
    "noImplicitAny": false,
    "module": "system",
    "moduleResolution": "node",
    "rootDir": "src",
    "target": "es5"
  }

  , "exclude": [
    "jspm_packages",
    "node_modules",
    "typings/main.d.ts",
    "typings/main"
  ]
}

What am I missing???

UPDATE

TypeScript will only emit the import if it is used later in the code. I just needed the additional operators to listen to a valueChanges observable to an Angular2 control. However, the additional operators cannot be patched if the Observable class of rxjs is missing. So you kind of need to force TypeScript to emit the System.register for Observable by importing like this:

// boot.ts
import 'rxjs/Observable'
import 'rxjs/add/operator/debounceTime'
...

All credit goes to @RyanCavanaugh who pointed me into the right direction.


Solution

  • The answer from the comments, which successfully resolved the issue:

    import 'rxjs/Observable'

    Reference: https://github.com/Microsoft/TypeScript/wiki/FAQ#why-are-imports-being-elided-in-my-emit