Skip to main content
V
Veenu
Level 2
October 22, 2020
Solved

Integrate Angular 10 component with AEM 6.4

  • October 22, 2020
  • 2 replies
  • 1532 views

Hello All,

 

Hope you're doing well. I need help with one use. I need to integrate my angular 10 component with AEM 6.4. The catch here is angular component is present in bundle where there are Angular 1 components as well. If I compile the component separately and include the generated clientLib folder categories in AEM component it works fine. 

But we want that every time we do the maven build my angular 10 component should also get build. Basically need to integrate maven build with npm build.

If I follow this https://helpx.adobe.com/in/experience-manager/kt/sites/using/getting-started-spa-wknd-tutorial-develop/angular/chapter-1.html#integrate-angular-app

my angular module contains components with angular 1 and angular 10.

Kindly suggest.

 

Thanks,

Veenu Garg

 

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Anudeep_Garnepudi

Hi @veenu 

Use ui.frontend module which uses Webpack. Run node module, it will take care of all dependencies. Read the below article it might help.

https://docs.adobe.com/content/help/en/experience-manager-core-components/using/developing/archetype/uifrontend.html

AG 

2 replies

D
Adobe Employee
davidjgonzalezzzzAdobe Employee
Adobe Employee
October 22, 2020

Are you asking how you have your Maven AEM project invoke a Node.JS project that builds all your Angular components (both 1 and 10) into there compiled bundles, and automatically adds them (the built bundles) to your AEM Project deployment package as clients libs? If so, check out the ui.frontend project in the WKND Sites project (or the ui.frontend project generated from the latest AEM Project archetype).

Note that even though your on AEM 6.4 the ui.frontend project is "agnostic" to the version of AEM you're deploying to as its all "build-based"; meaning the JS/CSS are compiled and injected into the deployment artifact at (maven) build time - AEM runtime has no idea how those JS bundles were created, just that they're there and referenced by the defined clientlib category.

Anudeep_Garnepudi
Community Advisor
Anudeep_GarnepudiCommunity AdvisorAccepted solution
Community Advisor
November 2, 2020

Hi @veenu 

Use ui.frontend module which uses Webpack. Run node module, it will take care of all dependencies. Read the below article it might help.

https://docs.adobe.com/content/help/en/experience-manager-core-components/using/developing/archetype/uifrontend.html

AG 

AG
    Terms & ConditionsAccessibility statement

    Loading footer...