Hugo pipes - SCSS not re-compiling on server or watch

Hello,

I just started a fresh Hugo site (v0.49), and am following the docs to use pipes to compile my SCSS.

I’ve followed the docs word for word in my head.html:

{{ $sass := resources.Get "scss/main.scss" }}
{{ $style := $sass | resources.ToCSS | resources.Minify }}
<link rel="stylesheet" href="{{ $style.Permalink }}">

The SCSS will compile when I start the server or if I build via hugo CLI command. However if I change any SCSS while watching or hugo server, Hugo doesn’t recompile the SCSS, even after forced browser refresh and hard refresh, even though it sees a change in the file. I’ve also tried this with the fingerprint pipe.

My SCSS files are in:

/themes/myThemeName/assets/scss/main.scss

I’ve tried this CLI command:

hugo server -w --noHTTPCache --disableFastRender

And it still doesn’t help. There’s nothing else to the site besides an index.html, head.html and my scss files, just trying to get this working.

Am I missing something here?

Not sure if this is related.

I don’t think so… It detects changes, but the SCSS isn’t actually compiled and the site isn’t reloaded. The only time I can get the SCSS to compile is on a hard hugo build.

What does the terminal say while the server runs? Try the verbose option:

hugo server -w --noHTTPCache --disableFastRender -v
1 Like

I get a couple warnings about i18n:

WARN 2018/09/27 09:29:41 No translation bundle found for default language "en"
WARN 2018/09/27 09:29:41 Translation func for language en not found, use default.
WARN 2018/09/27 09:29:41 i18n not initialized, check that you have language file (in i18n) that matches the site language or the default language.

And when I change SCSS files, not a whole lot more:

Static file changes detected
2018-09-27 09:28:10.697 -0500
Syncing /scss/_global.scss to /
INFO 2018/09/27 09:28:11 Received System Events: ["/<path/to/project>/static/scss/_global.scss": CHMOD]

There is also this line:

Watching for changes in /<path/to/project>/{content,data,layouts,static,themes}

My SCSS is in the assets directory in my theme, could Hugo not be looking there specifically?

Weird, the setup works on my machine™. I made a test repo: https://github.com/dirkolbrich/scss-reload-test

start live reload with hugo server -w -v --disableFastRender and change color in assets/scss/main.scss. This changes the background color of the main div instantly.

1 Like

Yeah, looks like your test repo works on my machine as well! Going to investigate what could be different between ours.

Got it working! I think it had something to do with how my index.html template was set up. I made sue to include define "main" and everything came together.

Thanks for your help! :smiley:

Hi I’m having the same experience. @Coleman_Rollins how do you solve the problem?

Same issue too. Have you solved the problem?

Please read Requesting Help and please do not reply to years-old topics.