Node.js / Angular unable to serve files behind symbolic links - node.js

Question

We have an angular application that is deployed in a container, with an injected configuration file when starting (so not when building). We used to have it on Angular 7 (Node.js 10), and there we had no issues. We are currently in the process of upgrading to Angular 12 (Node.js 14), and are running into issues with our injected configuration file.
The configuration file is injected as assets/environments/environment.json, but in practice (due to the container system), environment.json is a symbolic link to assets/environments/.data/environment.json.
Now somewhere in the application, we try to get this file (through a regular HTTP call) to load our configuration. This http call works for http://<url>/assets/css/all.css, for example, but not for http://<url>/assets/environments/environment.json, seemingly because of the symbolic link.
What can we do to be able to HTTP get this file, hidden behind the symbolic link?
For completeness, our package.json:
{
"scripts": {
"start": "serve -s dist",
"build": "ng build --configuration production",
"serve": "ng serve --host 0.0.0.0",
"test": "ng test",
"lint": "ng lint"
},
"private": true,
"dependencies": {
"#angular/animations": "^12.1.0",
"#angular/cdk": "^12.1.0",
"#angular/cli": "^12.1.0",
"#angular/common": "^12.1.0",
"#angular/compiler": "^12.1.0",
"#angular/compiler-cli": "^12.1.0",
"#angular/core": "^12.1.0",
"#angular/forms": "^12.1.0",
"#angular/platform-browser": "^12.1.0",
"#angular/platform-browser-dynamic": "^12.1.0",
"#angular/router": "^12.1.0",
"#ngx-translate/core": "^13.0.0",
"#ngx-translate/http-loader": "^6.0.0",
"#popperjs/core": "^2.9.2",
"adal-angular": "^1.0.18",
"bootstrap": "^5.0.2",
"core-js": "^3.15.1",
"jquery": "^3.6.0",
"messageformat": "^2.3.0",
"ngx-translate-messageformat-compiler": "^4.10.0",
"popper.js": "^1.16.1",
"primeicons": "^4.1.0",
"primeng": "^12.0.0",
"process": "^0.11.10",
"rxjs": "^7.1.0",
"serve": "^12.0.0",
"tslib": "^2.3.0",
"util": "^0.12.4",
"zone.js": "^0.11.4"
},
"devDependencies": {
"#angular-builders/custom-webpack": "^12.1.0",
"#angular-devkit/build-angular": "^12.1.0",
"#angular/language-service": "^12.1.0",
"#types/adal-angular": "^1.0.1",
"#types/jasmine": "^3.7.7",
"#types/jasminewd2": "^2.0.9",
"#types/node": "^15.12.5",
"codelyzer": "^6.0.2",
"jasmine-core": "^3.7.1",
"jasmine-spec-reporter": "^7.0.0",
"karma": "^6.3.4",
"karma-chrome-launcher": "^3.1.0",
"karma-coverage-istanbul-reporter": "^3.0.3",
"karma-jasmine": "^4.0.1",
"karma-jasmine-html-reporter": "^1.6.0",
"protractor": "^7.0.0",
"ts-node": "^10.0.0",
"tslint": "^5.11.0",
"typescript": "^4.3.4"
}
}
and our angular.json:
{
"$schema": "./node_modules/#angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"application-name": {
"root": "",
"sourceRoot": "src",
"projectType": "application",
"prefix": "app",
"schematics": {},
"architect": {
"build": {
"builder": "#angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/",
"index": "src/index.html",
"main": "src/main.ts",
"preserveSymlinks": true,
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.app.json",
"assets": [
"./src/favicon.ico",
"./src/assets"
],
"styles": [
"./node_modules/bootstrap/dist/css/bootstrap.min.css",
"./src/assets/css/all.css",
"./src/styles.css"
],
"scripts": [
"./node_modules/bootstrap/dist/js/bootstrap.bundle.min.js",
"./node_modules/jquery/dist/jquery.slim.min.js",
"./node_modules/popper.js/dist/umd/popper.min.js"
]
},
"configurations": {
"production": {
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"budgets": [
{
"type": "initial",
"maximumWarning": "2mb",
"maximumError": "5mb"
}
]
}
}
},
"serve": {
"builder": "#angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "application-name:build"
},
"configurations": {
"production": {
"browserTarget": "application-name:build:production"
}
}
}
}
}
}
}