Angular 6 application cannot find namespace 'google'

So I came across the problem earlier on GitHub and this worked for me:

• npm install --save-dev @types/googlemaps

• Adding to all my tsconfig*.json: types: [ "googlemaps"]

• Adding at the top of my file: declare const google: any;

• Adding at the end of the body of my index.html:

  <script async defer type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=****"> </script>

Try it out and tell me whether it works.

The tsconfig.json file that really needs to be updated is in src/tsconfig.app.json.

That files overrides the types property of compilerOptions of the tsconfig.json file in the root directory with an empty array so you must add the types definition for googlemaps there.

For example:

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "types": ["googlemaps"]
  },
  "exclude": ["test.ts", "**/*.spec.ts"]
}