Expand my Community achievements bar.

SOLVED

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

Avatar

Level 5

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?

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

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/archetyp...

 

View solution in original post

3 Replies

Avatar

Correct answer by
Community Advisor

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/archetyp...

 

Avatar

Level 1

I've done everything you said and confirmed /apps/project/clientlibs but it still doesn't change my css.
of course, i did the   mvn clean install -PautoInstallSinglePackage at the last
appclient.pnghtml.pngresult.pngrun-npm-dev.pngui.frontend-dist.png