Deploying an Angular app in an Openshift container with multiple environments (Dev, QA, Prod) poses a challenge.
The CLIENT_ID is used in the code base with environment.CLIENT_ID to access its value. It works fine on localhost.
There are two environment files in the source code:
- environment.ts
export const environment = {
production: false,
CLIENT_ID: xyz-456
}
- environment.prod.ts
export const environment = {
production: false,
CLIENT_ID: "$CLIENT_ID"
}
project.json file
"configurations": {
"production": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
}
ocp_configs/qat-a/app_cfg.env file
CLIENT_ID=abcd-123
In the Openshift container under ConfigMaps YAML, QAT values are displayed as CLIENT_ID: abcd-123.
Issue - The production configuration works correctly locally with the nx serve command. However, after deployment for QAT, it still fetches Dev values instead of QAT values.
When accessing the URL for the QAT app, the CLIENT_ID remains as xyz-456, while it should be abcd-123.
Initially, FileReplacement seemed to be the problem, but I couldn't find a solution despite searching. Using Angular 14.