Added Bootstrap but running "mvn clean install PautoInstallBundle" in ui.frontend resets my clientlibs in/apps. | Community
Skip to main content
sesmic
sesmic
Level 4
August 8, 2022
Solved

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

  • August 8, 2022
  • 1 reply
  • 1425 views

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!

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 Aditya_Chabuku

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

1 reply

Sachin_Arora_
Community Advisor
Sachin_Arora_Community Advisor
Community Advisor
August 9, 2022

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

 

    sesmic
    sesmicAuthor
    Level 4
    August 9, 2022

    Thanks for the reply.
    I did as you said & bootstrap js & css were also added to clientlibs. But bootstrap isn't working. To add "dependencies: ['bootstrap']" don't we need to add categories = bootstrap5 to that folder?

      Aditya_Chabuku
      Community Advisor
      Aditya_ChabukuCommunity AdvisorAccepted solution
      Community Advisor
      August 9, 2022

      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

      Thanks,Aditya Chabuku
        Terms & ConditionsAccessibility statement

        Loading footer...