Error: scss

[11110]

Running Hugo 0.53, different errors appearing on .scss files update. Errors occur if any scss file edited

Here how I handle scss files

   {{ with resources.Get "layouts/shortcodes/s/sb-10/sb_10.scss"  | toCSS      }}
     <style >{{ .Content | safeCSS }}</style>
   {{ end }}

Console output:
panic: runtime error: invalid memory address or nil pointer dereference
[signal SIGSEGV: segmentation violation code=0x1 addr=0x30 pc=0x4960abd]

github.com/gohugoio/hugo/commands.(*commandeer).handleEvents(0xc0001360c0, 0xc071490240, 0xc087d4ffe0, 0xc0ca010600, 0x18, 0x20, 0xc069f84e40)

Sometimes I receive the next error:

panic: no pageOutput

goroutine 16018 [running]:
github.com/gohugoio/hugo/hugolib.pageRenderer(0xc038027180, 0xc0992a1bc0, 0xc0992a1b60, 0xc0a44272b0)
        /private/tmp/hugo-20181224-67428-1wm0x79/hugo-0.53/src/github.com/gohugoio/hugo/hugolib/site_render.go:119 +0xd24
created by github.com/gohugoio/hugo/hugolib.(*Site).renderPages
        /private/tmp/hugo-20181224-67428-1wm0x79/hugo-0.53/src/github.com/gohugoio/hugo/hugolib/site_render.go:43 +0x160

Couldn’t find any explanation of such behavior, any help?)

[regis]

Would you try removing that pipe from the with clause ? I’m thinking this has something to do with the error.

You can preform the transformation from within the with instead.

[11110]

The problem is that I usually use toCSS pipe in combination with postCSS. I couldnt find another way to preprocess scss, inline css and pipe with postcss using hugo without gulp, could you advice any?

[11110]

Just tried to remove pipe

{{ with resources.Get "layouts/shortcodes/s/sb-10/sb_10.scss"   }}
<style >{{ .Content | safeCSS  }}</style>
{{ end }}

and my css didn’t load. I need toCSS pipe to process sass

[bschoen]

I think @regis meant something like this (untested):

{{ with resources.Get "layouts/shortcodes/s/sb-10/sb_10.scss"   }}
    <style >{{ .Content | toCSS | safeCSS  }}</style>
{{ end }}

[11110]

I’ve tried to do so but instead received this error
Error: Error building site: "/hugo/content/page/index.md:12:1": failed to render shortcode "p/p-11": failed to process shortcode: "/hugo/layouts/shortcodes/s/sb-10/sb-10.html:6:22": execute of template failed: template: shortcodes/s/sb-10/sb-10.html:6:22: executing "shortcodes/s/sb-10/sb-10.html" at <toCSS>: error calling toCSS: type string not supported in Resource transformations

[regis]

@bschoen yes but you cant pipe .toCSS to .Content, only to the resource, the “dot” in the with context.

The following is untested, but you get the gist.

{{ with resources.Get "layouts/shortcodes/s/sb-10/sb_10.scss"   }}
    <style >{{ (. | toCSS | safeCSS).Content  }}</style>
{{ end }}

[11110]

Just tested

Error: Error building site: "/hugo/content/page/index.md:12:1": failed to render shortcode "p/p-11": failed to process shortcode: "/hugo/layouts/shortcodes/s/sb-10/sb-10.html:6:24": execute of template failed: template: shortcodes/s/sb-10/sb-10.html:6:24: executing "shortcodes/s/sb-10/sb-10.html" at <safeCSS>: error calling safeCSS: unable to cast resource.transformedResource{commonResource:resource.commonResource{}, cache:(*resource.ResourceCache)(0xc00007c200), sourceFilename:"", linker:resource.permalinker(nil), transformation:(*scss.toCSSTransformation)(0xc0229195f0), transformInit:sync.Once{m:sync.Mutex{state:0, sema:0x0}, done:0x0}, transformErr:error(nil), publishInit:sync.Once{m:sync.Mutex{state:0, sema:0x0}, done:0x0}, published:false, content:"", contentInit:sync.Once{m:sync.Mutex{state:0, sema:0x0}, done:0x0}, transformedResourceMetadata:resource.transformedResourceMetadata{Target:"", MediaTypeV:"", MetaData:map[string]interface {}{}}, Resource:(*resource.genericResource)(0xc012253340)} of type resource.transformedResource to string

Maybe there are any other possible options?

[bschoen]

The error messages states safeCSS can’t be on a resource, so i guess (untested):

{{ with resources.Get "layouts/shortcodes/s/sb-10/sb_10.scss" }}
    <style> {{ (. | toCSS).Content | safeCSS }} </style>
{{ end }}

[regis]

@bschoen

“layouts/shortcodes/s/sb-10/sb_10.scss”

I didn’t catch that… Resource needs to be in assets directory. This one is not right?

[11110]

It could be, but the point is the error started to occur with project growing, with 400 pages I had no problem with sass files now I’m getting an error on the finish line )))

@bschoen, I’ve tried to use code above and it worked but the error remained

[bschoen]

Hmm, I see. I think your original code was doing exactly the same… so I guess it has nothing to do with the way you load your sass files. (But they really should be in your assets directory like @regis mentioned. I guess they already are, because resources.get retrieves the file relative to the asset directory).

I can’t make anything from the original error output, I’m afraid.

[bep]

@11110

{{ with resources.Get “layouts/shortcodes/s/sb-10/sb_10.scss” | toCSS }}

Resources needs to live in /assets directory. The error you get suggests a bug in the error handling, but you should correct your SCSS handling as a first step.

[11110]

Okey, I’m doing some project changes to make a test, it will take some time I’ll write back as soon as I check it

[Leo_Merkel]

This is how I use it (as a partial named 'css.html):

{{ $inServerMode := .Site.IsServer }}
{{ $sass         := resources.Get "scss/main.scss" | resources.ExecuteAsTemplate "style.main.scss" . }}
{{ $sassIncludes := (slice "assets/dependencies/" "assets/scss/" "assets/scss/vendors/") }}
{{ $cssTarget    := "css/styles.css" }}
{{ $cssOpts      := cond ($inServerMode) (dict "targetPath" $cssTarget "enableSourceMap" true "includePaths" $sassIncludes) (dict "targetPath" $cssTarget "includePaths" $sassIncludes "outputStyle" "compressed") }}

{{ if or ($inServerMode) (eq hugo.Environment "local") }}

    {{ $css := $sass | toCSS $cssOpts }}
    <link rel="stylesheet" href="{{ $css.Permalink | absURL }}" media="screen">

{{ else }}

    {{ $css := $sass | toCSS $cssOpts | resources.PostCSS | fingerprint }}
    <link rel="stylesheet" href="{{ $css.Permalink | absURL }}" integrity="{{ $css.Data.Integrity }}" media="screen">

{{ end }}

[11110]

I moved all files to /static/assets and this not really resolved the issue. I’ve tried to move files to assets folder(without static folder in the path ) - it didn’t work. Yesterday I noticed that rebuild of files break not only on scss file change but also on html modification. I found out that hugo tries to change .idea file, so as I work in webstorm .idea folder is always created.

I tried to work with sublime text and it worked for a while, but broke in the end. My thought was to include .idea folder with ignorefiles = [ "/.idea" ] in config.toml but it didn’t work out. I tried different regex but it looks like property "ignorefiles " doesn’t really works as expected

Now as I moved all styles to /static/ and moved all project to “project” directory on scss file change I see some unexpected for me behavior. When I change scss file I see next console output:

I guess change detection works without stop and it may be the problem because anyway it breaks at the end
with following error
panic: no pageOutput

goroutine 85514 [running]:
github.com/gohugoio/hugo/hugolib.pageRenderer(0xc00bcc3500, 0xc01d9d4960, 0xc01d9d4900, 0xc05b9e1f30)
        /private/tmp/hugo-20181224-67428-1wm0x79/hugo-0.53/src/github.com/gohugoio/hugo/hugolib/site_render.go:119 +0xd24
created by github.com/gohugoio/hugo/hugolib.(*Site).renderPages
        /private/tmp/hugo-20181224-67428-1wm0x79/hugo-0.53/src/github.com/gohugoio/hugo/hugolib/site_render.go:43 +0x160

[11110]

any help?

[zwbetz]

@11110 can you share your code?

[11110]

I would love to, but It’s companies project so I cant share it. Maybe there are some common mistakes or any clues that I should view ?

[zwbetz]

Create a small sample project that reproduces your issue, then share that.
That way we’re all on the same page.