Sage - Compile separate SASS file into separate css file

sage
1

Here’s my scenario… I have custom landing pages that have unique css for each. Currently, I am using assets/styles/landing-pages/ to hold my sass files for the landing pages. The issue is that the css is becoming too confusing as well as bloating my main.css.

What I would like to do is this:

  1. Store one sass file for each landing page in assets/styles/landing-pages
  2. Have Gulp SKIP this directory when compiling and building main.css
  3. Have an additional Gulp task that looks in this folder and compiles EACH file in this directory and outputs a single css with the same name as the source and place it in /dist/styles/landing-pages

I was going to add a gulp task but not sure how to do this. Any help would be most appreciated! Thx…

2

Hi, i too would like to know how let asset-builder process a separate CSS file from SCSS sources.

I tweaked manifest.json adding:

"new.css": {
  "files": [
    "styles/whatever/style.scss"
  ]
}

and of course it works, but in that way, i gather in new.css all the styles from the frontend packages already linked in main.css.

There’s a way to do it without learn Gulp (that has been already dropped in Sage 9) ?