53a352795a
60a58d123 Remove outdated references in scss-sass.md 225a03834 Revert "Update menus.md" 7d149dd1e Update menus.md 3694ecafc Fix theme submission process/repository 0277c202c Update index.md - fix typo (#1490) 8921f0462 Fix link to theme components in 0.42 release notes (#1489) c948bd519 Release 0.85.0 ee5bc5be9 releaser: Add release notes to /docs for release of 0.85.0 f2f692c32 commands: Make the --poll flag a duration 13070337a docs: Regen CLI docs git-subtree-dir: docs git-subtree-split: 60a58d123d9f9d20ee7d09373812ce4428dffcdf
2.1 KiB
Executable file
| 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 |
|
|
02 | 02 | 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
- transpiler [string] {{< new-in "0.80.0" >}}
-
The
transpilerto use, valid values arelibsass(default) anddartsass. Note that the Embedded Dart Sass project is still in beta. We will try to improve the installation process when it has stable releases, but if you want to use Hugo with Dart Sass you need to download a release binary from Embedded Dart Sass (Hugo after 0.81.0 requires beta 6 or newer) and make sure it's in your PC's$PATH(or%PATH%on Windows). - 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(LibSass) andexpanded(Dart Sass). Other available output styles for LibSass areexpanded,compactandcompressed. Dart Sass only supportsexpandedandcompressed. - precision [int]
- Precision of floating point math. Note: This option is not supported by Dart Sass.
- 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 %}}