angular-cli: Build fails with `Cannot redefine property: File` using Node 20.6.0

Command

build

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

If you use Node 20.6.0 (released yesterday) to build an Angular 16 papp, the following error occurs:

TypeError: Cannot redefine property: File
    at Function.defineProperty (<anonymous>)
    at Object.<anonymous> (/home/user/my-project/node_modules/@angular/compiler-cli/node_modules/@babel/core/lib/index.js:7:8)

I know Node 20 is not officially supported at the moment and it’s not yet in LTS, but it worked before (in 20.5.1) and maybe it’s good too approach this issue early. The relevant changes in Node might get backported to node 18.

I also don’t know yet if this is an issue in Node, babel or angular-cli. In either case, it might be good to have this as a tracking issue.

Also affects Angular 15 and Angular 17.0.0-next.0.

Minimal Reproduction

nvm install 20.6.0
nvm use 20.6.0
npx @angular/cli@latest new my-project # (using defaults)
cd my-project
npx ng build

Exception or Error

⠇ Generating browser application bundles (phase: building)...node:internal/process/promises:289
            triggerUncaughtException(err, true /* fromPromise */);
            ^

TypeError: Cannot redefine property: File
    at Function.defineProperty (<anonymous>)
    at Object.<anonymous> (/home/user/my-project/node_modules/@angular/compiler-cli/node_modules/@babel/core/lib/index.js:7:8)
    at Module._compile (node:internal/modules/cjs/loader:1241:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1295:10)
    at Module.load (node:internal/modules/cjs/loader:1091:32)
    at Module._load (node:internal/modules/cjs/loader:938:12)
    at Module.require (node:internal/modules/cjs/loader:1115:19)
    at require (node:internal/modules/helpers:130:18)
    at Object.<anonymous> (/home/user/my-project/node_modules/@angular/compiler-cli/node_modules/@babel/core/lib/config/helpers/config-api.js:16:9)
    at Module._compile (node:internal/modules/cjs/loader:1241:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1295:10)
    at Module.load (node:internal/modules/cjs/loader:1091:32)
    at Module._load (node:internal/modules/cjs/loader:938:12)
    at Module.require (node:internal/modules/cjs/loader:1115:19)
    at require (node:internal/modules/helpers:130:18)
    at Object.<anonymous> (/home/user/my-project/node_modules/@angular/compiler-cli/node_modules/@babel/core/lib/config/files/configuration.js:48:18)
    at Module._compile (node:internal/modules/cjs/loader:1241:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1295:10)
    at Module.load (node:internal/modules/cjs/loader:1091:32)
    at Module._load (node:internal/modules/cjs/loader:938:12)
    at Module.require (node:internal/modules/cjs/loader:1115:19)
    at require (node:internal/modules/helpers:130:18)
    at Object.<anonymous> (/home/user/my-project/node_modules/@angular/compiler-cli/node_modules/@babel/core/lib/config/files/index.js:73:22)
    at Module._compile (node:internal/modules/cjs/loader:1241:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1295:10)
    at Module.load (node:internal/modules/cjs/loader:1091:32)
    at Module._load (node:internal/modules/cjs/loader:938:12)
    at Module.require (node:internal/modules/cjs/loader:1115:19)
    at require (node:internal/modules/helpers:130:18)
    at Object.<anonymous> (/home/user/my-project/node_modules/@angular/compiler-cli/node_modules/@babel/core/lib/index.js:184:14)
    at Module._compile (node:internal/modules/cjs/loader:1241:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1295:10)
    at Module.load (node:internal/modules/cjs/loader:1091:32)
    at cjsLoader (node:internal/modules/esm/translators:282:14)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:233:7)
    at ModuleJob.run (node:internal/modules/esm/module_job:217:25)
    at async ModuleLoader.import (node:internal/modules/esm/loader:308:24)
    at async importModuleDynamicallyWrapper (node:internal/vm/module:428:15)
    at async Object.customOptions (/home/user/my-project/node_modules/@angular-devkit/build-angular/src/tools/babel/webpack-loader.js:49:64)
    at async Object.loader (/home/user/my-project/node_modules/babel-loader/lib/index.js:67:20)

Node.js v20.6.0

Your Environment

_                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 16.2.1
Node: 20.6.0 (Unsupported)
Package Manager: npm 9.8.1
OS: linux x64

Angular: 16.2.3
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1602.1
@angular-devkit/build-angular   16.2.1
@angular-devkit/core            16.2.1
@angular-devkit/schematics      16.2.1
@angular/cli                    16.2.1
@schematics/angular             16.2.1
rxjs                            7.8.1
typescript                      5.1.6
zone.js                         0.13.1

Warning: The current version of Node (20.6.0) is not supported by Angular.

Anything else relevant?

No response