Property 'distinct' does not exist on type Observable<CustomType>

[jvanbruegge]

My initial problem was here: http://stackoverflow.com/questions/36245443/add-data-to-observable
Now I figured out a solution by myself, using merge and map/filter. For this to work, I need the distinct Operator to kill double values, but my typescript complains that distinct is not part of the Observable, only distinctUntilChanged

RxJS version:
beta.2 and beta.4

Code to reproduce:
https://plnkr.co/edit/VAM0chq0VzQ90nA9AmcW
see in the console that distinct is not a function

Expected behavior:
I can use distinct as Operator

Actual behavior:
I cannot use it

Additional information:
using atom-ts for compiling typescript

[kwonoj]

Import Rx.kitchensink for extended operators, kitchenSink serves as full battery included including distinct operator. https://github.com/ReactiveX/rxjs/blob/master/src/Rx.KitchenSink.ts#L9 .

Closing issue, please feel freely reopen if it's not resolved.

[kwonoj]

Also one thing forgot, you may able to import distinct separately after import core rx as similar to

// patch Observable with appropriate methods
require('rxjs/add/operator/map');

Observable.of(1,2,3).map(function (x) { return x + '!!!'; }); // etc

(cjs example, but typescript works same way)

[jvanbruegge]

I tried that and it didnt work, but your first comment seems to work, thanks!

[jvanbruegge]

how do I import the Rx.KitchenSink into my app? In the bundles folder is no js file for it, so system.js trys to get it from the server

[jvanbruegge]

Ok, doesnt work at all, reopening now

[kwonoj]

@SuperManitu , please check this plnkr at https://plnkr.co/edit/AF8TyxiIRbokxVBK27Iu . I've amended your pnlkr above.

changes are

• load kitchensink build for system js
• import rx from kitchensink : `import * as Rx from '.../kitchenSink'

[jvanbruegge]

The KitchenSink build seems not to be part of the npm package, the only way to get it is the cdn
My compiler still doesnt like the distinct operator, but i can emit the js that is working fine.
Any ideas how to get rid of the compile error message?

[zachgrayio]

I've been trying to import these additional operators into an angular2 + webpack project with no joy, and I've tried all of the typical solutions. If I recall, I had some success using the import 'rxjs/add/operator/...' method under system.js but have since moved away from system.js all together. Wondering if anyone has any thoughts on this?

[kwonoj]

@zachgrayio would you mind to share some snippets to reproduce issue?

[kwonoj]

@SuperManitu , I could confirm npm package also includes kitchenSink as well. If you're problem persists with b.6, would you share bare minimum repo to able to reproduce issue?

[zachgrayio]

@kwonoj I'll try to get a repo or plunkr up sometime soon, thanks for the attn

[zachgrayio]

@kwonoj A bit of relevant info before I get around to uploading something: I'm working with a recent fork of https://github.com/angular/angular2-seed as a starting point, and I've opened an issue over there too as it might be more relevant to webpack than to rxjs: angular/angular2-seed#59

[kwonoj]

Yes, repo would be helpful. I'm having hand-crafted ng2-rxjs webpack configuration and so far it's working, I think it can be resolved somehow.

[zachgrayio]

@kwonoj

Here's an example - i just forked the angular2-seed repo and followed the most common, basic instructions to import additional operators, with no other changes. Maybe this is a bit too naive, but I thought it was a good starting point: zachgrayio/angular2-seed-add-operators@aa40285

[zachgrayio]

Here's a branch of the fork'd repo where I tried to resolve using Rx.KitchenSink, still no joy. zachgrayio/angular2-seed-add-operators@fd82bef

[kwonoj]

@zachgrayio - try this :

package.json

   "dependencies": {
     "angular2": "2.0.0-beta.15",
     "core-js": "^2.2.0",
-    "rxjs": "5.0.0-beta.2",
+    "rxjs": "^5.0.0-beta.6",
     "zone.js": "~0.6.11"
   },

seed-app.ts

import {Observable} from "rxjs/Observable";

-import 'rxjs/add/operator/distinct'
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/distinct';
 // relative paths to node_modules don't work any better:

What's changed?

1. You should use latest version of rxjs package. Operator patching (module-augmentation) is not implemented in b.2
2. You should import create method of as well, because import {Observable} imports barebone only without any creation method as well.

[zachgrayio]

@kwonoj Ah, ok that makes sense - I had a hunch this might be the case but never followed through. What version of ng2 are you running?

npm ERR! peerinvalid The package [email protected] does not satisfy its siblings' peerDependencies requirements!
npm ERR! peerinvalid Peer [email protected] wants [email protected]

[kwonoj]

Oops, forgot peerdependency - I'm using npm@3 and installed rxjs separately, so it bypasses peerdependency check. At least there's angular/angular#8047 will bump up peerdependency as well.

[zachgrayio]

@kwonoj Awesome, I'll likely do the same thing. Good lookin' out dude!

[zachgrayio]

For anyone who ends up here, this is the commit that fixed my operator woes: zachgrayio/angular2-seed-add-operators@cdd825c

If you run into the peer dependency issue due to being ahead of the peerdependency curve, you can install npm3 with sudo npm i -g npm@3 and then npm i will succeed due to it's new dependency resolution model.

[kwonoj]

I believe latest b.6 correctly exports operator under kitchenSink, closing this issues for now due to inactivity. @SuperManitu , if you're still having troubles to import operators correctly it'd be appreciate to provide snippets / barebone repo to able to reproduce those issues.

[lock]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.