nativescript-angular: NS_HTTP_PROVIDERS angular rc4 with nativescript-angular@0.3.1 still problem

If you just import NS_HTTP_PROVIDERS and set on your bootstrap, you won’t pass through the Typescript compiler and will get this error:

Found peer TypeScript 1.8.10
node_modules/nativescript-angular/http/ns-http.d.ts(8,22): error TS2415: Class 'NSHttp' incorrectly extends base class 'Http'.
  Types of property 'get' are incompatible.
    Type '(url: string, options?: RequestOptionsArgs) => Observable<any>' is not assignable to type '(url: string, options?: RequestOptionsArgs) => Observable<Response>'.
      Type 'Observable<any>' is not assignable to type 'Observable<Response>'.
        Property 'source' is protected but type 'Observable<T>' is not a class derived from 'Observable<T>'.

To check this bug, follow these steps:

tns create myapp --template tns-template-hello-world-ng

Then, import NS_HTTP_PROVIDERS:

import {NS_HTTP_PROVIDERS} from 'nativescript-angular/http';
nativeScriptBootstrap(AppComponent, [NS_HTTP_PROVIDERS])

So try add a platform and run:

tns platform add ios
tns run ios --emulator

Temporary solution

If you’ve set compilerOptions to false on tsconfig.json, the tsc will ignore it, and your app will run great. (Even if you use Http service).

I believe something related to the declaration on node_modules/nativescript-angular/http/ns-http.d.ts that doesn’t follow with the angular rc-4.

About this issue

Original URL
State: closed
Created 8 years ago
Comments: 31 (20 by maintainers)

Most upvoted comments

Just one note for anyone in the future who might run into this (again). Occasionally npm will also install RXJS into a sub-folder of one of the modules; if you continue to get this error even after you have deleted your node_modules folder. Double check each of the modules to see if they have any sub “node_modules” folders themselves; and if they do; delete any extra the “rxjs” that ends up in as a sub-folder version. The beta5 that got installed by one of them; conflicted with the beta12 that was needed by everything else, and caused the primary error in this issue.

NathanaelA on Feb 17, 2024

Closing since the problem should be resolved with 2.0.0 final and the NativeScriptHttpModule that sets up providers for you.

hdeshev on Sep 21, 2016

Update:

Workaround

First of all the workaround that worked for me was to add rxjs dependency in the project’s package.json:

"dependencies": {
  "rxjs": "5.0.0-beta.6",
   ...
},

Clean node_modules and do fresh npm install after.

The Problem

I think the problem is that the nativescript-angular package has a hard dependency on rxjs. So after the npm install I ended up with 2 copies of rxjs:

node_modules/rxjs - because of @angular/code peerDependency
node_modules/nativescript-angular/node_modules/rxjs - because of the ns-angular dependency

The typescript compiler uses different Observable definitions for nativescript-angular/http and @angular/http and throws the weird error.

If you have dependency to rxjs in your app’s package.json, npm uses that and doesn’t download a second copy of it inside node_modules/nativescript-angular/node_modules. This probably depends on the node/npm versions. My setup: node@4.4.5/npm@2.15.5.

The Solution

Probably using peerDependency to rxjs (and the others like ‘zone.js’ etc.) in the nativescript-angular and include those as dependencies in the project-template will fix the problem.

We need to test that to be sure it works. I the meantime - you can test if the workaround above works.

CC @NathanWalker @tjvantoll

vakrilov on Aug 24, 2016

I hit this one in Groceries, and unfortunately I can’t seem to make the problem go away. I tried using next after clearing out my node_modules, platforms, and so forth and I can’t get this error to go away.

Regardless, I can’t update the Getting Started tutorial to use next, so this is a blocking issue for me upgrading the tutorial to {N} 2.2 and Angular RC 4. A 0.3.1 release with a fix would be great 😄

tjvantoll on Aug 11, 2016

I would personally like to see weekly releases of ‘nativescript-angular’ but until that happens I will be using ‘next’ tag with everything myself. Too many important and valuable things go into master at every commit from what I’ve seen to not be using latest.

NathanWalker on Aug 11, 2016

I did exactly that here and have no issues using the ‘next’ tag and rc.4

NathanWalker on Aug 11, 2016

Try clearing node_modules and platforms then setup again with that ‘next’ tag.

NathanWalker on Aug 11, 2016

Thanks @leocaseiro I can confirm this report.

@vakrilov If you instead use "nativescript-angular": "next", in your package, all is good to go. So it appears 0.3.0 does not include the latest 😕

NathanWalker on Aug 11, 2016