Skip to main content
V
vidhu
January 29, 2021

Is it possible to create component specific clientlibs in AEM6.5 Webpack?

  • January 29, 2021
  • 1 reply
  • 1354 views

I am using AEM 6.5 ui.frontend webpack. Here if I compile scss to css it will complie in clientlibs-site/site.css. But I want component scss files to compile at the component level, I don't one one css file for all the components. Is this possible in Webpack? If yes, then how I can configure this.

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

1 reply

Suraj_Kamdi
Community Advisor
Suraj_KamdiCommunity Advisor
Community Advisor
January 29, 2021

@vidhu 

Yes, it is possible to create a separate component-specific clientlib folder using ui.frontend module.

 

Create separate <component-name>clientlib.config.js

and set the clientlib path as follows

const CLIENTLIB_DIR = path.join( __dirname, '..', 'ui.apps', 'src', 'main', 'content', 'jcr_root', 'apps', 'aem-project', 'components', 'component-name' 'clientlibs' );

also, you need o update the respective module's configuration in the as same as clientlib.config.js file.

 

 

Suraj Kamdi
    V
    vidhuAuthor
    January 29, 2021

    Hi @suraj_kamdi 

     

    But this solution will work only for one or few components. If I have more than 15 components then I have to manually write the config. Is this any way it will automatically pick the sass component files and compile in component client-libs.

      Terms & ConditionsAccessibility statement

      Loading footer...