9d31f650da
bb15e9804 Update index.md (#1339) ffb2f21d1 Update index.md fc154ac02 Regenerate CLI docs a0a687738 Update index.md d0e35a844 Update index.md 86d0cc042 Update index.md bdaf7e022 Release 0.81.0 b51017445 releaser: Add release notes to /docs for release of 0.81.0 888dd8fcc docs: Regen CLI docs 8c3e8b270 docs: Regen docs helper 79e3e1ebc Merge commit 'acb9109df778fa4a51c0d8b29b3212b12988908f' 31f70af7e modules: Add config option modules.vendorClosest 2631df94e markup/goldmark: Add attributes support for blocks (tables etc.) 19dee04ad Update to Dart Sass Protocol beta6 e507721fe Refactor: Write to stdout by default d204bf160 Refactor: Remove powershell support 91bea48f5 Feat: Add zsh, fish and powershell completion support 9c915ea27 docs: Remove mention of a file size limit for readFile 5acc8b6c7 js: Add Inject config option 45321989e js: Add Shims option git-subtree-dir: docs git-subtree-split: bb15e9804ae56da41f3bdb361adc14f8711fc19d
2.2 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 (beta 5 at the time of writing). The release is scheduled for Q1 2021. We will try to improve the installation process by then, 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 %}}