How to sync ui.frontend to aem server(crxde) | Community
Skip to main content
T
Tessa_learner1
Level 4
August 5, 2022
Solved

How to sync ui.frontend to aem server(crxde)

  • August 5, 2022
  • 1 reply
  • 4830 views

Hello , 

 

I have added some css styles to .scss in ui.frontend. I want that chagnes to be updated in aem server. How can I do this. I tried running the ui.frontend module alone also ran the whole build. But I couldn't see the changes in aem server. Anyone help me with this please?

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 Sachin_Arora_

Please follow these steps :

  • Run npm run dev : It will update clientlib-site and clientlib-dependencies and update ui.apps folder in file system.
  • Deploy updated code to AEM. Command : mvn clean install -PautoInstallPackage

Once the code is installed , please check your changes under /apps/project/clientlibs/clientlib-site. If changes are not there probably then you need to check first step I mentioned above. The command npm run dev builds your CSS & JS files using webpack. You can refer the scripts section in package.json of ui.frontend module.

"dev": "webpack --env dev --config ./webpack.dev.js && clientlib --verbose",

If you see your changes in /apps/project/clientlibs and same clientlibs you are able to see getting loaded on page, then probably you need to clean cache of your browser to reflect latest changes.

Document : https://experienceleague.adobe.com/docs/experience-manager-core-components/using/developing/archetype/uifrontend.html?lang=en

 

1 reply

Sachin_Arora_
Community Advisor
Sachin_Arora_Community AdvisorAccepted solution
Community Advisor
August 5, 2022

Please follow these steps :

  • Run npm run dev : It will update clientlib-site and clientlib-dependencies and update ui.apps folder in file system.
  • Deploy updated code to AEM. Command : mvn clean install -PautoInstallPackage

Once the code is installed , please check your changes under /apps/project/clientlibs/clientlib-site. If changes are not there probably then you need to check first step I mentioned above. The command npm run dev builds your CSS & JS files using webpack. You can refer the scripts section in package.json of ui.frontend module.

"dev": "webpack --env dev --config ./webpack.dev.js && clientlib --verbose",

If you see your changes in /apps/project/clientlibs and same clientlibs you are able to see getting loaded on page, then probably you need to clean cache of your browser to reflect latest changes.

Document : https://experienceleague.adobe.com/docs/experience-manager-core-components/using/developing/archetype/uifrontend.html?lang=en

 

    T
    Tessa_learner1Author
    Level 4
    August 5, 2022

    @sachin_arora_ Thank you so much. It worked. I can able to see the changes. 

      Terms & ConditionsAccessibility statement

      Loading footer...