Live-reloading during development

Live reloading does not work with assets (CSS and JS). I have seen this issue reported here and also in a few different articles online. Browser cache is to blame. Any workaround for this?

Yes, browser cache.

Try to fingerprint when you calling your files (css or JS) like that:

  {{ $style := resources.Get "css/style.css" | minify | fingerprint }}
  <link rel="stylesheet" type="text/css" href="{{ $style.Permalink }}" integrity="{{ $style.Data.Integrity }}" media='all' />

This will sort your issue with browser cache.

That wouldn’t work for inline styles

{{ $style := resources.Get "css/style.css" | minify | fingerprint }}
 <style>{{ $style.Content }}</style>

No, it will not. In that case, bast to use Incognito/InPrivate browser window which shall help a bit, but not fully.

I remember it was working before I started using Hugo Pipes (if I am not wrong). I call all my CSS files as in your example (in the footer) and my example (in the header). Even fingerprinting does not refresh the hash unless I close git and do hugo serve again.

Found an answer

I had assets defined as a static directory in config.toml. Removing it from there fixed this issue. I wonder if this is a bug?

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.