Angular 11: Why can't the compiler find 'GeolocationPosition' during compiling? "Cannot find name 'GeolocationPosition'"

Question

Why does the angular compiler can't find GeolocationPosition and GeolocationPositionError? VSC doesn't give an error and only during compiling it gives me an error.

Error: src/app/modules/shared/services/position.service.ts:10:46 - error TS2304: Cannot find name 'GeolocationPosition'.

10   private positionSource = new ReplaySubject<GeolocationPosition>(1);

I worked around this by putting the any type instead, but I'm just curious why Angular is giving me the error and how I can fix this.

I've already tried different compiler targets (es5, es6, es2018) but with no luck. Already installed @types/core-js but also without any luck. Is there any @types module that I'm missing perhaps?

This is my current tsconfig.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true,
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es5",
    "module": "es2020",
    "lib": [
      "es2018",
      "dom"
    ]
  },
  "angularCompilerOptions": {
    "strictInjectionParameters": true,
    "strictInputAccessModifiers": true,
    "strictTemplates": true
  }
}

Answer 1

In typescript 4.0.x this type was called Position. In typescript 4.1.x it was renamed to GeolocationPosition.

I think you'll find that your VS Code is using its built in version of typescript and that your project is using an earlier version.

To fix:

npm install --save-dev [email protected]