Base solution for your next web application
Open Closed

Angular Environment Setup #7971


User avatar
0
ray created

Hi,

I'm trying to figure out how to get my environments configured by following these URL's but ZERO is

slightly set up a little different...

https://blog.angulartraining.com/how-to-manage-different-environments-with-angular-cli-883c26e99d15 https://medium.com/@balramchavan/configure-and-build-angular-application-for-different-environments-

7e94a3c0af23 https://medium.com/@balramchavan/separating-production-and-development-http-urls-using-environment-ts-

file-in-angular-4c2dd0c5a8b0

What i have done is I've created a new environment.01Test.ts file with the code like so...

export const environment = { production: false, hmr: false, appConfig: 'appconfig.01test.json', };

In my appconfig.01test.json i have added these...

"remoteServiceBaseUrl": "URL to my API", "appBaseUrl": "URL to my APP ",

In my package.json i have added this...

"build-01test": "ng build --configuration=01test"

In my angular.json i have added this to the configurations & serve sections...

"01test": { "optimization": true, "outputHashing": "all", "sourceMap": false, "extractCss": true, "namedChunks": false, "aot": true, "extractLicenses": true, "vendorChunk": false, "buildOptimizer": true, "fileReplacements": [ { "replace": "src/environments/environment.ts", "with": "src/environments/environment.01test.ts" } ] }

"01test": { "browserTarget": "abp-zero-template:build::01test" }

In my terminal I then run ...

ng build --configuration 01test

I have an Azure Devops CI/CD setup for Angular and in my CI I have a task called replace tokens

(*/environment.01test.ts) where it detects my target environment file (which points to my test API server

side as mentioned above in appconfig.01test.json), so that when the app gets deployed to IIS it knows the

backend its talking too, I also have an NPM task for command & arguments to 'run build-01test'

Is there anything else i need to configure in ZERO to make all this work properly or have i covered all the

files?

My CI/CD works but when i go to my IIS no files are there and nothing to browse to for angular. Is there anything I need to do with DIST or node_modules to make it work properly?

Thanks


3 Answer(s)
  • User Avatar
    0
    ismcagdas created
    Support Team

    Hi @ray

    The steps for publishing your Angular app is correct with a custom environment.

    • Have you moved your Angular app into your Host app or are they still separated ?
    • Could you share your CI/CD publish steps and related commands ?

    Thanks,

  • User Avatar
    0
    ray created

    Hi ismcagdas

    OK great i wasnt sure if i had other files to change due to no files deployed to IIS.

    Both separated. Sure no probs...I'll put steps into other open ticket

    Thanks!

  • User Avatar
    0
    ismcagdas created
    Support Team

    Hi,

    We are currently handling this in remote support. Closing because of that.