Sass files do not compile

Highlighted
Tourist
6 0 1

In the header of the theme.liquid file I've added an additional css link for some custom css.

<link rel="stylesheet" href="{{ 'custom-styles.scss.css' | asset_url }}">

In this Sass file I'm trying to import some additional .sccs.liquid files, so I can split things up and keep things organized:

@import 'sheet1.css', 'sheet2.css';

I've got these 2 sheets saved in the assets folder.

What I was hoping to happen is that first the 'sheet1.scss.liquid' being compiled and imported/added in the 'custom-styles.scss.css' sheet, after that the 'sheet2.scss.liquid' and also imported/added to the 'custom-styles.scss.css'. Finally, linked in the header of 'theme.liquid', all the custom css will be together in 1 single sheet.

 

Unfortunately, it seems the 'sheet1' and 'sheet2' are not being compiled. I do not have any local workflow with Gulp or similar.

0 Likes
Highlighted
Shopify Partner
61 3 10

The SCSS available from Shopify is a 'stripped back' version - it does not support Imports etc. You're better of compilng a SCSS file locally.

0 Likes
Highlighted
Tourist
6 0 1

This is what I was afraid of. Too bad!

0 Likes