'jhipster based nhipster server start error

I am trying to generate Angular NestJS based application using Jhipster i.e, nhipster. Below is my jhipster and nodejs version numbers:

Jhipster : 7.7.0 NodeJS: 16.14.0 LTS

But I am getting the below error, when I am trying to start the server:

Error:

/projects/nhipster/mauto/server/node_modules/ts-node/src/index.ts:240
    return new TSError(diagnosticText, diagnosticCodes)
           ^
TSError: ⨯ Unable to compile TypeScript:
src/client/header-util.ts:56:19 - error TS2552: Cannot find name 'URL'. Did you mean 'url'?

56         url = new URL('http://localhost' + url);
                     ~~~

  src/client/header-util.ts:55:32
    55     private static prepareLink(url, pageNumber, pageSize, relType): any {
                                      ~~~
    'url' is declared here.

    at createTSError (/Users/kmadasu/kishore/mnkb/projects/nhipster/mauto/server/node_modules/ts-node/src/index.ts:240:12)
    at reportTSError (/Users/kmadasu/kishore/mnkb/projects/nhipster/mauto/server/node_modules/ts-node/src/index.ts:244:19)
    at getOutput (/Users/kmadasu/kishore/mnkb/projects/nhipster/mauto/server/node_modules/ts-node/src/index.ts:360:34)
    at Object.compile (/Users/kmadasu/kishore/mnkb/projects/nhipster/mauto/server/node_modules/ts-node/src/index.ts:393:11)
    at Module.m._compile (/Users/kmadasu/kishore/mnkb/projects/nhipster/mauto/server/node_modules/ts-node/src/index.ts:439:43)
    at Module._extensions..js (node:internal/modules/cjs/loader:1155:10)
    at Object.require.extensions.<computed> [as .ts] (/Users/kmadasu/kishore/mnkb/projects/nhipster/mauto/server/node_modules/ts-node/src/index.ts:442:12)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
[nodemon] app crashed - waiting for file changes before starting...


Solution 1:[1]

That "URL" function at your line "56" is not imported into the typescript module properly. It is a function that comes from dom definition inside the typescript compiler. You could find a way to import it into the header-util class. Another way, and what I'd do is enable "dom" in the compiler options in the ts-config file of the server, by adding "dom" to the lib array like so:

{
  "compilerOptions": {
   /* Basic Options */
     "typeRoots": ["node_modules/@types"],
     "target": "ES2017" /* Specify ECMAScript target version: 'ES3' (default), 
     'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */,
     "module": "commonjs" /* Specify module code generation: 'none', 'commonjs', 
     'amd', 'system', 'umd', 'es2015', or 'ESNext'. */,
     "lib": [
          "es6",
          "dom"    /* <--- here you are */
     ]
     ...
     }

Sources

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

Source: Stack Overflow

Solution Source
Solution 1 njeru