Angular 16 with esbuild throws [ERROR] Could not resolve "src/polyfills.ts"

[NudeFox]

Command

build, serve

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

Enabling the "builder": "@angular-devkit/build-angular:browser-esbuild" in angular.json leads to the following error

Minimal Reproduction

1. enable esbuild
2. run ng serve or ng build
3. tsconfig.json

{
    "compileOnSave": false,
    "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "baseUrl": "src/",
    "declaration": false,
    "downlevelIteration": true,
    "esModuleInterop": true,
    "experimentalDecorators": true,
    "importHelpers": false,
    "lib": [
	"ES2022",
        "dom",
        "esnext.asynciterable"
    ],
    "module": "ES2022",
    "moduleResolution": "node",
    "noUnusedLocals": true,
    "outDir": "./dist/out-tsc",
    "paths": {
      "@app/*": [
        "app/*"
      ],
      "@env/*": [
        "environments/*"
      ],
      "@auth/*": [
        "app/auth/*"
      ],
      "@layout/*": [
        "app/layout/*"
      ],
      "@core/*": [
        "app/core/*"
      ],
      "@shared/*": [
        "app/shared/*"
      ],
      "@svg-icons": [
        "app/config/svg-icons.config"
      ]
    },
    "resolveJsonModule": true,
    "sourceMap": false,
    "target": "ES2022",
    "typeRoots": [
      "node_modules/@types"
    ],
    "types": [
      "jest",
      "node"
    ],
    "useDefineForClassFields": false
  },
  "angularCompilerOptions": {
	"fullTemplateTypeCheck": true,
	"strictInjectionParameters": true
  },
  "exclude": [
	"node_modules"
  ]
}

Exception or Error

[ERROR] Could not resolve "src/polyfills.ts"
angular:polyfills:entry:1:7:
      1 │ import 'src/polyfills.ts';
        ╵        ~~~~~~~~~~~~~~~~~~

  You can mark the path "src/polyfills.ts" as external to exclude it from the bundle, which will remove this error.

Your Environment

Angular CLI: 16.0.5
Node: 18.16.0
Package Manager: npm 9.5.1
OS: darwin x64

Angular: 16.0.4
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1600.5
@angular-devkit/build-angular   16.0.5
@angular-devkit/core            16.0.5
@angular-devkit/schematics      16.0.5
@angular/cdk                    16.0.3
@angular/cli                    16.0.5
@angular/flex-layout            15.0.0-beta.42
@angular/material               16.0.3
@schematics/angular             16.0.5
rxjs                            7.8.1
typescript                      5.0.4
webpack                         5.86.0

Anything else relevant?

No response

[ASDAlexey]

I have the same issue on angular 16.0.4

[alan-agius4]

Are you adding src/polyfills.ts in the files property?

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "./out-tsc/app",
    "types": []
  },
  "files": [
    "src/main.ts",
    "src/polyfills.ts"
  ],
  "include": [
    "src/**/*.d.ts"
  ]
}

[NudeFox]

@alan-agius4 Yes, here is tsconfig.app.json

{
	"extends": "./tsconfig.json",
	"compilerOptions": {
		"outDir": "./out-tsc/app",
		"types": []
	},
	"files": [
		"src/main.ts",
		"src/polyfills.ts"
	],
	"include": [
		"src/**/*.d.ts"
	],
	"exclude": [
		"src/test.ts",
		"src/**/*.spec.ts"
	]
}

It seems to me like the problem lies in redefining the baseUrl in tsconfig.json to enable path aliases. And the builder doesn't take that into account.
I've tried to clone a starter project with Angular 16 and if i modify the tsconfig with those paths it gives the same error.

[alan-agius4]

Can confirm that the problem is caused by the baseUrl.

[IbenTesara]

@alan-agius4 is there any news on this or a way to fix this? We're currently running into issues to build our environments because of this.

Update:

We were able to let the builds run again by removing "outputHashing": "all" and "namedChunks": false. Not sure why this changed anything, so if anyone who knows more about this can let me know why this would influence it I'd appreciate 🙏

[jcompagner]

the thing is i just need todo this:

  "polyfills": "polyfills.ts",

instead of

   "polyfills": "src/polyfills.ts",

so yes something is wrong where it thinks it should look at.

[cklogs]

I am seeing this issue in our project and none of the above suggestions fix the issue.
@alan-agius4 is there any movement on this problem?

[AbdealiLoKo]

I had the same issue and changing

  "polyfills": "src/polyfills.ts",

to:

  "polyfills": "polyfills.ts",

worked for me. Thanks @jcompagner