Added Bootstrap but running "mvn clean install PautoInstallBundle" in ui.frontend resets my clientlibs in/apps.

Question

Actually, I needed to add/include Bootstrap 5 in my project referring this post. And worked.
Solved: How to enable/add Bootstrap version 5 in my projec... - Adobe Experience League Community - 409989
But whenever I am running "mvn clean install -PautoInstallBundle" in ui.frontend after creating .scss for my component, my clientlibs in /apps get reset & bootstrap support is gone. So, then again I've to add bootstrap files in clientlib.I am still learning, so I know I'm doing something wrong here. Thus, please tell me how to add bootstrap in my project.Thanks!

Aditya_Chabuku · Accepted Answer

Hi @sesmic , you need to add bootstrap5 as a category name, follow this article if it helps https://medium.com/adobetech/creating-a-bootstrap-carousel-from-core-components-8df7b2173d25   ~Aditya.Ch

Sachin_Arora_ · Answer

Whenever you will build ui.frontend, it will overwrite the clientlib-site and clientlib-dependency. If you are adding bootstrap as a separate library then you can update clientlib-dependency with category of bootstrap 5 clientlibs.

You can refer code of ui.frontend/clientlibs.config.js, it is creating clientlibs inside ui.apps. Refer sample code for addition of bootstrap5

name: 'clientlib-dependencies',
categories: ['project.dependencies'],
dependencies: ['bootstrap5'],

Add bootstap5 JS and CSS file in separate clientlibs in ui.apps/project/clientlibs/bootstrap5.

Also this command is to install bundle of project : mvn clean install -PautoInstallBundle

Refer this document for correct commands : https://experienceleague.adobe.com/docs/experience-manager-learn/getting-started-wknd-tutorial-develop/project-archetype/client-side-libraries.html?lang=en

Sign up

Login with SSO

Login to the community

Login with SSO