Skip to content
Permalink
Branch: master
Find file Copy path
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
executable file 49 lines (39 sloc) 1.47 KB
title description date publishdate lastmod categories keywords menu weight sections_weight draft
SASS / SCSS
Hugo Pipes allows the processing of SASS and SCSS files.
2018-07-14
2018-07-14
2018-07-14
asset management
docs
parent weight
pipes
30
2
2
false

Any SASS or SCSS file can be transformed into a CSS file using resources.ToCSS which takes two arguments, the resource object and a map of options listed below.

{{ $sass := resources.Get "sass/main.scss" }}
{{ $style := $sass | resources.ToCSS }}

Options

targetPath [string] : If not set, the resource's target path will be the asset file original path with its extension replaced by .css.

outputStyle [string] : Default is nested. Other available output styles are expanded, compact and compressed.

precision [int] : Precision of floating point math.

enableSourceMap [bool] : When enabled, a source map will be generated.

includePaths [string slice] : Additional SCSS/SASS include paths. Paths must be relative to the project directory.

{{ $options := (dict "targetPath" "style.css" "outputStyle" "compressed" "enableSourceMap" true "includePaths" (slice "node_modules/myscss")) }}
{{ $style := resources.Get "sass/main.scss" | resources.ToCSS $options }}

{{% note %}} Setting outputStyle to compressed will handle SASS/SCSS files minification better than the more generic [resources.Minify]({{< ref "minification">}}). {{% /note %}}

You can’t perform that action at this time.