search

DynamoMTL / shopify-pipeline

Shopify Pipeline - A modern pipeline for Shopify theme development
MIT License
86 stars 16 forks source link

Using liquid tags in SASS files #107

Closed mandymozart closed 6 years ago

mandymozart commented 6 years ago

We have been trying to reference assets in our SASS files, like the Debut Theme from Shopify for example is using.

background-image: url('{{ "svg/ico-select.svg" | asset_url }}');

Your recommended method is to use the generated SVG sprites and integrate any SVG into the DOM markup.

Can you say for sure that liquid parsing the SASS is not possible to recreate? Thanks, Tilman

nddery commented 6 years ago

Since we do not upload images, stylesheets and scripts to Shopify during development, no, liquid parsing won't work.

Have you tried to reference your image normally as you'd do in normal CSS ? ie.:

.some-selector {
  background-image: url('../images/svg/ico-select.svg');
}

css-loader will find these and resolves them.

mandymozart commented 6 years ago

@nddery hey nicolas, thanks that works excellent.