Hugo Pipes SCSS - "output style : compressed" VS "resources.Minify"

Hi,

As the title suggests I as just wondering what the difference between “output style : compressed” and “resources.Minify” is when piping my SCSS?

I’ve inspected the generated CSS and both approaches seem to minify / compress the output, so I’m thinking I should only need “outputStyle: compressed” right?

Thanks

update

it appears adding resources.Minify when using “outputSyle compressed” makes no change (i.e outputSyle compressed minifies). That being said, adding resources.Minify breaks my css sourcemap

From how I understand your question the ‘output style compressed’ is something the Sass library does itself. Here’s an overview of the different ways that Sass can render CSS code.

How and why that breaks your source map I cannot say. That being said, I wouldn’t be surprised if Sass removes the source map when you choose ‘compressed’, since that end up as minified code. Or if the minifier removes the source map.

It might even make sense, since the minifier removes all unnecessary characters from the CSS, and the source map is unnecessary for rendering a HTML page.

@Jura What I read in his post is that resources.Minify breaks source maps, not “outputstyle compressed”. Whish isn’t surprising. I don’t use source maps with minified output, but @BinaryJim is right in that if you are working with SASS/SCSS, using the compressed output is probably a better (should be faster) choice than using the CSS minifier as a separate step.

We should probably update our example documentation in this area.

/cc @regis

Just want to make I understand what is to be expressed in the doc.

I’ve been thinking about adding a “note” notifying that using ToCSS with both compressed and resources.Minify is redundant.

Shall we actually advise that using compressed is a better practice ?

It depends a little. If you, as one example, needs to concatenate multiple SCSS output sources … or if you use plain CSS …

But for the most common SCSS uses, I would say yes.

2 Likes