Property 'observable' must be of type 'symbol', but here has type 'unique symbol'.

[matt-goldman]

Intended outcome:

Install the apollo angular client

Actual outcome:

Client installs, but project will not compile. With a brand new Angular 11 project, with nothing done to it except ng add apollo-angular, I get the following error

ERROR in node_modules/@apollo/client/node_modules/symbol-observable/index.d.ts:6:14 - error TS2717: Subsequent property declarations must have the same type.  Property 'observable' must be of type 'symbol', but here has type 'unique symbol'.

    6     readonly observable: unique symbol;
                   ~~~~~~~~~~

      node_modules/@types/node/globals.d.ts:146:14
        146     readonly observable: symbol;
                         ~~~~~~~~~~
        'observable' was also declared here.

How to reproduce the issue:

1. Create a new Angular project
2. Install Apollo client with ng add apollo-angular
3. Try to build or run the project

Versions

System:
OS: Windows 10 10.0.18363
Binaries:
Node: 12.16.3 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.5 - ~\AppData\Roaming\npm\yarn.CMD
npm: 6.14.4 - C:\Program Files\nodejs\npm.CMD
Browsers:
Chrome: 86.0.4240.198
Edge: Spartan (44.18362.449.0)
npmPackages:
@apollo/client: ^3.0.0 => 3.2.6
apollo-angular: ^2.1.0 => 2.1.0

[matt-goldman]

Looks like this is the issue caused by #7335

[gaetancollaud]

Hi,

My solution was to set the symbol-observable version to 2.x.y instead of 3.x.y.

  "devDependencies": {
    "symbol-observable": "^2.0.3",

[fetis]

as workaround, you can install version 3.2.5 of the client with npm install @apollo/client@3.2.5

this fixed things on my side.

[benjamn]

This should now be fixed in @apollo/client@3.2.7, thanks to #7340, as verified by successfully running ng add angular-apollo in a new Angular application, following @matt-goldman's reproduction steps.

[fetis]

@benjamn yes, it's fixed now. thank you-thank you-thank you

[fetis]

@benjamn yes, it's fixed now. thank you-thank you-thank you