Apollo-angular: Error using 1.1.0 on Angular@5

[bmayen]

When we upgrade to v1.1.0 from v1.0.1 on an Angular5 project we're getting the following error using apollo.watchQuery:

ERROR TypeError: Object(...) is not a function

apollo.query works as expected

[kamilkisiela]

Here's my reproduction:
https://stackblitz.com/edit/simple-apollo-angular-example-ldymtv

Please provide yours so I can check what's wrong there.

[bmayen]

Unfortunately we're under NDA and I can't recreate with the example above. @nicobytes, are you experiencing the same issue? Can you recreate?

[phoenix741]

I have the same problème.
I try to make a small project that contains strict necessary to reproduce the problem :

https://drive.google.com/file/d/1hz7O5z47hzPsR4HqZ2jixhBbs6N_S2WR/view?usp=sharing

To test, you can make

npm install
npm run dist
npm run start

Go to localhost:3000 and see the error in the console.

[Yogu]

The problem seems to be rxjs@5 - apollo-angular imports from from rxjs, but that's only available in version 6. I don't know if there is a way to support both versions in a straight-forward way, though.

[bmayen]

If rxjs@6 is a new dependency, shouldn't this be a major version increment instead of 1.1.0?

[jestebanzapata]

I'm also getting this error with the GraphQL subscriptions. Here there is a code example where I was able to generate the same error. I don´t know why but when the code is executed on Stackblitz the error is different:

https://stackblitz.com/github/javadababadoo/DemoGraphQLTest

https://github.com/javadababadoo/DemoGraphQLTest

[vikingschris]

I'm getting a similar issue. ERROR TypeError: Object(...) is not a function at new QueryRef (QueryRef.js:6) at ApolloBase.watchQuery (Apollo.js:30) Is there a way to fix this issue without upgrading rxjs version to 6? If I upgrade to rjxs@6, i would have to go to each file that uses rxjs and refactor the imports.

[Yogu]

You can just keep using [email protected] in the meantime if you don't need new features. In the long run, an upgrade to rxjs is probably inevitable due to angular.

[kamilkisiela]

Upgrading to RxJS 6 should be simple

https://www.learnrxjs.io/concepts/rxjs5-6.html

I did it in few large projects and there was no big issues.

[cbyte]

We use Ionic, which depends on RxJs 5.*. How can we still use Apollo in our Ionic 4.7 Projects?

[kamilkisiela]

@cbyte you can just use older version of apollo-angular

[riginoommen]

@cbyte Yes You are correct my issues are fixed by downgrading.

[hansand]

@riginoommen which version of apollo angular are you using ? i am facing the same error here. cloud u please share your package.json file here?

[riginoommen]

Hello @hansand47

Here is my dependencies

"dependencies": {
"@angular/animations": "^5.2.1",
"@angular/common": "^5.2.1",
"@angular/compiler": "^5.2.1",
"@angular/core": "^5.2.1",
"@angular/forms": "^5.2.1",
"@angular/http": "^5.2.1",
"@angular/platform-browser": "^5.2.1",
"@angular/platform-browser-dynamic": "^5.2.1",
"@angular/router": "^5.2.1",
"angular-2-dropdown-multiselect": "^1.6.3",
"angular-oauth2-oidc": "^3.1.4",
"angular2-datetimepicker": "^1.1.1",
"apollo-angular": "^1.0.1",
"apollo-angular-link-http": "^1.1.1",
"apollo-cache-inmemory": "^1.2.5",
"apollo-client": "^2.3.5",
"bootstrap": "4.0.0-beta.2",
"chart.js": "^2.5.0",
"core-js": "^2.4.1",
"d3": "^5.5.0",
"font-awesome": "^4.7.0",
"graphql": "^0.13.2",
"graphql-tag": "^2.9.2",
"hammerjs": "^2.0.8",
"intl": "^1.2.5",
"jquery": "^3.2.1",
"moment": "^2.20.1",
"ng-circle-progress": "1.0.0",
"ngx-matomo": "^0.1.0",
"ngx-pagination": "^3.1.0",
"ngx-pipes": "^2.0.5",
"ngx-progressbar": "^2.1.1",
"ngx-toastr": "^8.3.0",
"popper.js": "^1.12.9",
"rxjs": "^5.5.11",
"socket.io-client": "^2.0.4",
"zone.js": "^0.8.14"
},
"devDependencies": {
"@angular/cli": "^1.6.2",
"@angular/compiler-cli": "^5.2.1",
"@angular/language-service": "^5.2.1",
"@types/d3": "^5.0.0",
"@types/jasminewd2": "~2.0.2",
"@types/jest": "^23.1.0",
"@types/node": "~6.0.60",
"codelyzer": "^4.0.1",
"jasmine-core": "~2.6.2",
"jasmine-spec-reporter": "~4.1.0",
"jest": "^23.1.0",
"jest-preset-angular": "^5.2.2",
"jest-zone-patch": "0.0.8",
"protractor": "~5.1.2",
"source-map-explorer": "^1.5.0",
"ts-node": "~3.2.0",
"tslint": "~5.7.0",
"typescript": "~2.4.2"
},

[thianlopezz]

Hello Im facing this issue with Ionic framework V3 I have configured
"rxjs": "^6.5.2", "rxjs-compat": "^6.5.2",

And I have try with some versions of apollo angular, and it doesnt work.