Angular v16 esbuild ignores base href

[adumitrescu-plenty]

Command

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

We have an application that uses a development environment inside docker container. For this we are using 'allowed hosts serve' options in which we specify our urls. We have a base href present in our intex.html. This works fine with browser builder. But when we try using 'browser-esbuild' it's not working anymore. All of the chunk files get 503 error including the @vite/client and .angular/cache/vite altho main.js, pollyfills.js and scripts.js load successfully.

Minimal Reproduction

This can be reproduced with a development environment inside docker container including our configuration from the description (a custom url inside 'allowed hosts' <e.g. 'my.custom.url'> and a base href <e.g. '/ui/foo' >). After the build is successful, navigate to the url my.custom.url/ui/foo and in the console you will see my.custom.url/chunk-123.js gets 503 error.

Exception or Error

No response

Your Environment

Angular CLI: 16.1.3
Node: 16.14.0
Package Manager: npm 9.7.2
OS: darwin x64

Angular: 16.1.3
... animations, cdk, cdk-experimental, cli, common, compiler
... compiler-cli, core, forms, language-service, material
... material-experimental, material-moment-adapter
... platform-browser, platform-browser-dynamic, router

Package                          Version
----------------------------------------------------------
@angular-devkit/architect        0.1601.3
@angular-devkit/build-angular    16.1.3
@angular-devkit/core             16.1.3
@angular-devkit/schematics       16.1.3
@angular-devkit/schematics-cli   16.1.3
@schematics/angular              16.1.3
ng-packagr                       16.1.0
rxjs                             7.8.1
typescript                       4.9.5

Anything else relevant?

No response

[d9j]

esbuild is such frustration. to deal with. i wish i didnt migrate my project. :(

[Djay77]

Same problem, the chunk file try to be loaded from the root. base href not considered !

[Danyyer]

I have the same issue when using the router with withHashLocation(). I am using @angular-devkit/build-angular 17.1.0-next.2

[conalryan]

Workaround for a single slash is to set the "serverPath" in the options "baseHref": "/some-app" ... "options": { "proxyConfig": "proxy.json", "servePath": "/" }

https://github.com/angular/angular-cli/blob/main/packages/angular_devkit/build_angular/src/builders/dev-server/vite-server.ts#L86

However this doesn't work for two slashes "baseHref": "/apps/some-app"

[alan-agius4]

Thanks for reporting this issue. Luckily, it has already been fixed in one of the recent releases. Please update to the most recent version to resolve the problem.

If the problem persists in your application after upgrading, please open a new issue, provide a simple repository reproducing the problem, and describe the difference between the expected and current behavior. You can use ng new repro-app to create a new project where you reproduce the problem.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}