Pass Angular environment variables to compiled static angular files in spring boot

Question

I am now using angular and spring boot to build website project. When we deploy, we will ng build --output-path=../spring-boot-project/src/main/resources/static", angular and generate a static folder in spring boot, like /resource/static. Then we build and deploy a .jar file to our prod(or lab) environment.

so when we run the .jar file, how can we pass some environment varibles to angular part(the static files in spring boot project).

More specifically, I want to set angular environment in spring boot application.yml:

spring:
  profiles:
    active: dev
  main:
    banner-mode: "off"

---

spring:
  profiles: dev
angular.v1: "something1_dev"
angular.v2: "something2_dev"


---

spring:
  profiles: prod
angular.v1: "something1_prod"
angular.v2: "something2_prod"

how can I pass these values(different values because of different profiles) to angular side?

Not exactly what you are looking for but have a look https://stackoverflow.com/questions/59249434/azure-devops-angular-environment-variables/59249554#59249554. So i would separate angular and spring unless you are using server side rendering — Vova Bilyachat, Jun 25 '20 at 04:56

Ananthapadmanabhan · Answer 1 · 2020-06-25T06:06:51.870

The issue with what you are asking is that , once you place the angular generated files under the static folder, springboot will treat the files as static assets and will not use any templating engine for us to bind any furthur data to the files. It will receive the request and if it matched the asset it will serve it directly.

For your use-case to work, you will have to set the angular environment in the angular build itself. What you could maybe do is, have the angular build parameterized like using maven profiles so that you could control the angular build using maven command itself. You might probably be using the front-end-builder plugin to trigger the angular build right. So , in that case when you provide the npm run-script command you could provide which customized command you want to run by providing different commands in your package.json. For buid setup read : How to integrate an Angular 4 app with a Spring Boot stack?

Thank you for your answer. right now I have already integrated angular with a spring boot stack, it works. my question: is there a way to pass angular environment variables to angular when the angular ui project already served as a static resource in spring boot. — Hongli Bu, Jun 25 '20 at 06:48

Pass Angular environment variables to compiled static angular files in spring boot

1 Answers1