Typescript import - relative references must start with

I am trying to use some node_modules from typescript and then use them in javascript for a visual studio 2022 project.

I have added the module like this

npm i @microsoft/dotnet-js-interop

in my Typescript file I import like this

import { DotNet } from '@microsoft/dotnet-js-interop'

When the module is transpiled to javascript the exact some text is used in the .js file

import { DotNet } from '@microsoft/dotnet-js-interop';

But the browser complains that

Uncaught TypeError: Failed to resolve module specifier "@microsoft/dotnet-js-interop". Relative references must start with either "/", "./", or "../".

I know I am missing something but I don't know where to look to find the answer. Why does the visual studio typescript compiler not convert it to a relative path. I assume I don't need to manually do this?

I have tried using paths with the typescript modules but it then says it cant find the module and no .JS file is produced.

My tsconfig.json file

{
  "compileOnSave": true,
  "compilerOptions": {
    "noImplicitAny": false,
    "noEmitOnError": true,
    "removeComments": false,
    "sourceMap": true,
    "module": "es6",
    "target": "es2015",    
    "moduleResolution": "node",
    "skipLibCheck": true,
    "allowJs": true,
    "outDir": "wwwroot/js"
  },
  "include": [
    "scripts/*"
  ]
}

Chris