'Cannot read properties of undefined (reading 'Platform') for Here Maps with React + Typescript

I'm using the demo code to build a simple Here map using React + Typescript. I'm getting a TypeError: Cannot read properties of undefined (reading 'Platform') at line #11:

   8 | React.useLayoutEffect(() => {
   9 |     if(!mapRef.current) return;
  10 | 
> 11 |     const platform = new H.service.Platform({
  12 | ^       apikey: // my API key
  13 |     });
  14 | 

And here is the beginning of the typescript file below:

import React from "react";
import * as H from "here-maps";

export function DisplayMap() {

    const mapRef = React.useRef(null);

    React.useLayoutEffect(() => {
        if(!mapRef.current) return;

        const platform = new H.service.Platform({
            apikey: // my API key
        });

        const defaultLayers = platform.createDefaultLayers();
        ...

Any clue what is the problem? I inspected H.service and it is a namespace and Platform is defined inside it. Not sure why it is undefined!

And this is my package.json file:

...
"dependencies": {
        
        "@types/heremaps": "^3.1.5",
        "ajv": "^6.12.0",
        "here-maps": "^3.0.2",
        "react": "^16.13.0",
        "react-dom": "^16.13.0"
    },
    "devDependencies": {
        "@types/jest": "^24.9.1",
        "@types/node": "^12.12.6",
        "@types/react": "^16.9.23",
        "@types/react-dom": "^16.9.5",
        "react-scripts": "3.4.0",
        "typescript": "^3.7.5"
    },
...


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source