Adobe CQ和SASS/SCSS

Max*_*lah 5 sass aem

我想问一下adobe CQ是否支持SASS/SCSS?谁有经验吗?

Bro*_*die 5

@diffa是正确的,因为SASS没有原生支持,但是LESS被接受了.如果您不想使用LESS路线,那么SASS集成并不难.我们目前正在使用SASS/Compass [与sass模板http://www.archetypecss.com/]集成我们的开发堆栈.

为了解决问题,我们正在使用一个非常简单的MVN项目来构建我们的应用程序.在SCSS之前,我们的项目看起来像

Maven/
  bundle/
    /path/to/our/java
  content/
    /path/to/our/jcr_root (apps/etc)
Run Code Online (Sandbox Code Playgroud)

我们为这个项目添加了一个文件夹

Maven/sass/config.rb

然后在Config.rb我们的设置中将SCSS目录和目标CSS目录设置到我们的etc/design文件夹中,这样我们就可以将SCSS保存在我们希望CSS编译到的位置.然后我们将compass compile命令连接到我们的构建脚本中.简化的是:

compass compile 
mvn clean
mvn build
Run Code Online (Sandbox Code Playgroud)

如果您不使用maven,只要在config.rb为src scss/sass文件设置正确的路径然后将目标编译目录设置为您的设计类别,就可以执行相同的操作./etc

我们做的其他一些事情是从我们的pom.xml中排除scss文件,以便maven只在已编译的css中构建,然后从我们的版本控制系统中删除我们编译的CSS文件.这允许我们的团队对scss进行版本控制,同时不必担心我们的JCR周围浮动的scss文件什么都不做.

示例工作流程:

  1. Dev进行了改变
  2. Dev运行构建脚本
  3. Dev检查本地

如果我们不在Maven上,而且我们使用像vlt这样的东西就像是

  1. Dev进行了改变
  2. Dev运行指南针编译(或者此时罗盘手表可能更合适)
  3. Dev运行vlt/pckmgr /无论如何
  4. Dev检查本地

示例文件:

maven/
  bundle/
    /path/to/javas
  content/
    /src/main/content/jcr_root/
      etc/designs/myproj
        /css
          main_styles.sass  <= src
          main_styles.css   <= compiles to
  maven/
    config.rb
      sass_dir = ../content/src/main/content/jcr_root
      css_dir = ../content/src/main/content/jcr_root
Run Code Online (Sandbox Code Playgroud)

如果你注意到,我将sass和css目录设置为jcr_root.这允许我们将sass文件放在任何地方jcr_root(无论是全部etc/designs还是我们需要在应用程序的组件中使用特殊scss,文件将编译).

.........

它有点挂钩,但绝对值得.