Vue configs in AEM

Avatar

Avatar
Validate 1
Level 2
sateeshk9319722
Level 2

Likes

2 likes

Total Posts

27 posts

Correct reply

0 solutions
Top badges earned
Validate 1
Boost 1
View profile

Avatar
Validate 1
Level 2
sateeshk9319722
Level 2

Likes

2 likes

Total Posts

27 posts

Correct reply

0 solutions
Top badges earned
Validate 1
Boost 1
View profile
sateeshk9319722
Level 2

18-08-2020

Hello all,

We have created the config folder in vue project the hierarchy is something like this :

-config

 -dev.env.js

-prod.env.js

and how the configurations will pick when this bundle has deployed into AEM.

Or need some assistance on how to manage such things based on the environment in Vue+AEM.

 

Many Thanks,

 

Accepted Solutions (1)

Accepted Solutions (1)

Avatar

Avatar
Establish
MVP
BrianKasingli
MVP

Likes

646 likes

Total Posts

607 posts

Correct reply

239 solutions
Top badges earned
Establish
Ignite 1
Give Back 5
Give Back 3
Give Back 10
View profile

Avatar
Establish
MVP
BrianKasingli
MVP

Likes

646 likes

Total Posts

607 posts

Correct reply

239 solutions
Top badges earned
Establish
Ignite 1
Give Back 5
Give Back 3
Give Back 10
View profile
BrianKasingli
MVP

18-08-2020

@sateeshk9319722

You can integrate build scripts in the package.json where a specific build script will build the environment variables into the bundle.js during webpack or gulp JavaScript compilation.

Take example: https://github.com/adobe/aem-project-archetype/blob/master/src/main/archetype/ui.frontend.angular/pa...

Or if your environment values are stored in the AEM server as JSON, you can utilise run modes, and OSGI configurations, to render the path of the configuration apart of the HTML page, then use JavaScript to make an XHR (request) to the request from the path.

 

<div class="global-config" data-global-config="/en-gb.global.json"></div>

 

Answers (0)