ng serve fails when using custom SSL configuration #31894
Description
Which @angular/* package(s) are the source of the bug?
Don't known / other
Is this a regression?
Yes
Description
I am trying to run my Angular application with a custom SSL configuration using ng serve. My angular.json serve configuration looks like this:
"serve": { "builder": "@angular/build:dev-server", "options": { "port": 4444, "ssl": true, "sslKey": "./ssl/subdomain.domain.com-key.pem", "sslCert": "./ssl/subdomain.domain.com.pem", "host": "subdomain.domain.com" }, "configurations": { "production": { "buildTarget": "frontend:build:production" }, "staging": { "buildTarget": "frontend:build:staging" }, "development": { "buildTarget": "frontend:build:development" } }, "defaultConfiguration": "development" } When I run ng serve and access the URL https://subdomain.domain.com:4444, I encounter an error in the terminal.
Steps to reproduce:
- Configure angular.json as above with custom SSL certificates (I generated them using mkcert)
- Run ng serve.
- Open https://subdomain.domain.com:4444 in the browser.
Expected behavior:
The Angular application should serve over HTTPS on the specified port with the provided SSL certificate.
Actual behavior:
An error occurs in the terminal when accessing the URL and the site never loads.
Please provide a link to a minimal reproduction of the bug
No response
Please provide the exception or error you saw
uncaughtException TypeError: Cannot read properties of undefined (reading 'readable') at IncomingMessage._read (node:_http_incoming:211:19) at Readable.read (node:internal/streams/readable:739:12) at resume_ (node:internal/streams/readable:1257:12) at process.processTicksAndRejections (node:internal/process/task_queues:82:21) uncaughtException TypeError: Cannot set properties of undefined (setting 'content-security-policy') at ServerResponse.setHeader (node:_http_outgoing:664:31) at Immediate.write (file:///Users/stan/Code/angular-frontend/node_modules/vite/dist/node/chunks/config.js:11004:8) at process.processImmediate (node:internal/timers:485:21) Please provide the environment you discovered this bug in (run ng version)
Angular CLI : 21.0.0 Angular : 21.0.0 Node.js : 20.19.2 Package Manager : npm 11.6.3 Operating System : darwin arm64 ┌───────────────────────────┬───────────────────┬───────────────────┐ │ Package │ Installed Version │ Requested Version │ ├───────────────────────────┼───────────────────┼───────────────────┤ │ @angular/build │ 21.0.0 │ ^21.0.0 │ │ @angular/cdk │ 21.0.0 │ ^21.0.0 │ │ @angular/cli │ 21.0.0 │ ^21.0.0 │ │ @angular/common │ 21.0.0 │ ^21.0.0 │ │ @angular/compiler │ 21.0.0 │ ^21.0.0 │ │ @angular/compiler-cli │ 21.0.0 │ ^21.0.0 │ │ @angular/core │ 21.0.0 │ ^21.0.0 │ │ @angular/forms │ 21.0.0 │ ^21.0.0 │ │ @angular/platform-browser │ 21.0.0 │ ^21.0.0 │ │ @angular/platform-server │ 21.0.0 │ ^21.0.0 │ │ @angular/router │ 21.0.0 │ ^21.0.0 │ │ @angular/ssr │ 21.0.0 │ ^21.0.0 │ │ rxjs │ 7.8.2 │ ^7.8.2 │ │ typescript │ 5.9.3 │ ~5.9.3 │ └───────────────────────────┴───────────────────┴───────────────────┘ Anything else?
No response