using .scss file in AEM 6.1 | Community
Skip to main content
Samb
Samb
Level 2
April 9, 2016

using .scss file in AEM 6.1

  • April 9, 2016
  • 3 replies
  • 4352 views

Can you please let me know the how to include the .scss file in AEM 6.1. Also please suggest whether i can put this in a separate folder inside /etc/designs/projectname/scss/sample.scss and use the same without doing any build using maven.

 

Thanks

Siva.

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

    3 replies

    edubey
    edubey
    Level 10
    April 10, 2016

    Hi Siva,

    You add files from here http://localhost:4502/miscadmin#/etc/designs/projectname

    All files under etc/designs/projectname/ will be part of your project. You are free to add files and folder inside depend upon your requirement but if you are adding using crxde make sure you sync these changes back to you IDE using vaultclipse. This will make same changes in IDE where your project is present and next time when you take build everything should be fine.

    Thanks

    Samb
    SambAuthor
    Level 2
    April 10, 2016

    Thanks,But still want to check whether i can use the .scss  (http://sass-lang.com/documentation/file.SCSS_FOR_SASS_USERS.html)

    file in the same manner. 

    Thanks

    Siva

    edubey
    edubey
    Level 10
    April 11, 2016

    Take a look @ http://stackoverflow.com/questions/16458062/adobe-cq-and-sass-scss

    They have shown SASS usage with AEM

    I hope it help you

    M
    mickjleroy
    Level 2
    April 11, 2017

    I created a Sass compiler for AEM 6.2. It's still early days but it provides support for ".scss" files to be used in client libraries just like you would use ".less" files.

    https://github.com/mickleroy/aem-sass-compiler

      vjetty
      vjetty
      Level 4
      April 11, 2017

      Hi, Samb

      To compile scss files in you aem 6.1 project use the following plugin in your ui.apps pom file. 

      <!-- ====================================================================== --> <!-- SASS Plugin                                                         --> <!-- ====================================================================== --> <plugin> <groupId>nl.geodienstencentrum.maven</groupId> <artifactId>sass-maven-plugin</artifactId> <version>2.17</version> <executions> <execution> <phase>prepare-package</phase> <goals> <goal>update-stylesheets</goal> </goals> </execution> </executions> <configuration> <resources> <resource> <source> <directory>${project.parent.basedir}/ui.apps/src/main/content/jcr_root/etc/clientlibs/YOUR-PROJECT/scss</directory> </source> <destination>${project.parent.basedir}/ui.apps/src/main/content/jcr_root/etc/clientlibs/YOUR-PROJECT/css</destination> </resource> </resources> </configuration> </plugin>

      Make sure you change path according to your project.

      Thanks,

      Vamsi

      Terms & ConditionsAccessibility statement

      Loading footer...