Change remoteServiceBaseUrl when building for production

Question

When wanting to deploy to a server, we need to change remoteServiceBaseUrl in /src/assets/appconfig.json.

Is there a way to set remoteServiceBaseUrl/appBaseUrl differently depending on the environment?

Answer 1

You can use environment-specific files, e.g. appconfig.prod.json

• assets/
  • appconfig.json
  • appconfig.prod.json

It's not possible to copy different assets files based on environment: angular/angular-cli#9634

But angular-cli supports Multiple Apps integration.

You can copy the app object, modify assets configuration and add a name in angular-cli.json:

"apps": [
    {
        ...
        "assets": [
            {
                "glob": "**/!(appconfig.prod.json)",
                "input": "./assets/",
                "output": "./assets/"
            },
            ...
        ],
        ...
    },
    {
        "name": "prod",
        ...
        "assets": [
            {
                "glob": "**/!(appconfig.*)",
                "input": "./assets/",
                "output": "./assets/"
            },
            {
                "glob": "appconfig.prod.json",
                "input": "./assets/",
                "output": "./assets/appconfig.json"
            },
            ...
        ],
        ...
    }
],

Usage:

ng build -prod -app=prod

Answer 2

In the end, I rewrote AppPreBootstrap.ts with the following changes:

Added import { environment } from 'environments/environment';

Changed getApplicationConfig() to:

var version = environment.name ? '.' + environment.name : '';
return abp.ajax({
    url: '/assets/appconfig' + version + '.json',
    method: 'GET',
    headers: {
        'Abp.TenantId': abp.multiTenancy.getTenantIdCookie()
    }

And inside the environment config, I have a "name" parameter which matches the environment.name.json filename.

Now I can have appconfig.production.json and it works well.