Reading application settings from JSON file in angular application - json

Question

I have implemented the application configuration to be read from JSON file from my angular application so that it is easily configurable post deploment.
We use Octopus deployment tool to deploy the angular application. As you are aware the having he enviornment.ts file gets generated as js file and it
is very difficult to manipulate the settings in Octopus by reading the JS file. Hence I have created config.JSON file that would be outputted to the dist folder and
Octopus deploy can consume the JSON file to make changes whenever needed.
Currently the application is reading values from enviornment ts file which in turn is reading the values set in the Config.JSON file.
I would like to know if my approach is correct ?
Config.JSON
{
"settings": {
"production": false,
"userIdleMinutes": "10",
"corePingIntervalSeconds": "10",
"baseUrl": "http://localhost:57973",
"loginUrl": "/Login",
"adminUrl": "/Admin"
}
}
enviornment.ts
import config from '../assets/config.json'
// The file contents for the current environment will overwrite these during build.
// The build system defaults to the dev environment which uses `environment.ts`, but if you do
// `ng build --env=prod` then `environment.prod.ts` will be used instead.
// The list of which env maps to which file can be found in `.angular-cli.json`.
export const environment = {
production: config.settings.production,
baseUrl: config.settings.baseUrl,
loginUrl:config.settings.loginUrl,
adminUrl: config.settings.adminUrl,
userIdleMinutes: config.settings.userIdleMinutes,
corePingIntervalSeconds: config.settings.corePingIntervalSeconds
};

Answer 1

if you are using octopus, instead of doing that, in your environment.prod.ts add some tokens and replace them on each environment by octopus
(right now I don't have access to show you how, but something like below)
environment.prod.ts
export const environment = {
production: #{production},
baseUrl: "#{baseUrl}",
//... rest of your configs
};
then add a step to replace these variables with the variables defined in environment in main.*.js file on each deployment