CSS won't render on on watch

1

Hi, Hi,

I am sure I am missing something, but I can’t figure out what it is

During my local development, I type in hugo server - and off I go developing, however, my css changes WON’T render like the rest of my changes. For me to see them I have to kill the running server, and start it again.

I have tried

  • hugo server --disableFastRender --ignoreCache --forceSyncStatic
  • hugo server -wDF --enableGitInfo --forceSyncStatic --ignoreCache --noHTTPCache

Nothing seems to work :frowning:

2

There are a bunch of ways to get CSS into a Hugo project, not all of which benefit from the live reload feature. The easiest way for us to reproduce your issue is by cloning your project. :slight_smile:

3

I’m so sorry but that is not possible :frowning:

Let me give you some more info

Hugo Static Site Generator v0.51/extended linux/amd64 BuildDate: 2018-11-07T10:31:39Z

The CSS is added same as in this theme (I am building off this theme)

As I have mentioned, it’s just the live reload that doesn’t work, the CSS does work, but for me to see the changes, each time I have to restart the hugo server - I’m sure that’s not normal behaviour?

In my code I do

{{- $smashemSass         := "smashem-style.sass" }}
{{- $smashemCssTarget    := "css/smashem-style.css" }}
{{- $smashemCssOpts      := cond ($inServerMode) (dict "targetPath" $smashemCssTarget 
"enableSourceMap" true) (dict "targetPath" $smashemCssTarget "outputStyle" "compressed") }}

Then include that like

<!-- smashem styles -->
{{- if $inServerMode }}
{{- $smashemCss := resources.Get $smashemSass | toCSS $smashemCssOpts }}
<link rel="stylesheet" type="text/css" href="{{ $smashemCss.RelPermalink }}">
{{- else }}
{{- $smashemCss := resources.Get $smashemSass | toCSS $smashemCssOpts | minify | fingerprint }}
<link rel="stylesheet" type="text/css" href="{{ $smashemCss.RelPermalink }}" integrity="{{ 
$smashemCss.Data.Integrity }}">
{{- end }}
4

The next step is to make a smaller project that reproduces the problem. Then you can share it, or figure out which part isn’t working.

You can review Requesting Help for other advice on getting help.

The biggest reason you should do this is because even from your code examples, we can’t reconstruct your project.

When I change my CSS the live reload works. But I don’t use pipes. I do recall others discussing thism though, so you might try creative searches trying to track this down. :slight_smile:

5

You’ve been very helpful, thank you!