Live reload not working for SCSS when fingerprinting

support
1

On my site (GitHub - skrysmanski/docs: My collected knownledge and Hugo sources for manski.net; theme is a Git sub module) Hugo doesn’t live reload the pages if I change any of my .scss files (.ts files work fine, though).

I’m using Hugo 0.129.0 on Windows 11.

Repro (requires NodeJS/npm installed):

  1. git clone --recurse-submodules https://github.com/skrysmanski/docs
  2. cd themes/devlog-theme/assets
  3. npm install
  4. cd ../../..
  5. hugo server
  6. Open http://localhost:1313/articles/csharp-dotnet/configuration-system/ in browser
  7. Edit themes/devlog-theme/assets/styles/components/_page.scss and change color in line 57 to green.
  8. Notice how the text color in the box at the top change to green in the browser.
  9. Change color back to red.
  10. Notice how the text color did not change in the browser.

So, the first change is recognized by the reload script but the second change is not. However, the output of hugo server mentions the second change:

$ hugo server
Watching for changes in C:\Users\manski\Desktop\TempDocs\repro\{content,static,themes}
Watching for config changes in C:\Users\manski\Desktop\TempDocs\repro\hugo.yaml
Start building sites …
hugo v0.129.0-e85be29867d71e09ce48d293ad9d1f715bc09bb9+extended windows/amd64 BuildDate=2024-07-17T13:29:16Z VendorInfo=gohugoio


                   | EN
-------------------+------
  Pages            | 116
  Paginator pages  |   8
  Non-page files   |  82
  Static files     |  34
  Processed images |   0
  Aliases          | 116
  Cleaned          |   0

Built in 1278 ms
Environment: "development"
Serving pages from disk
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop

Change detected, rebuilding site (#1).
2024-07-20 13:45:26.698 +0200
Asset changed /styles/components/_page.scss
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Total in 440 ms

Change detected, rebuilding site (#2).
2024-07-20 13:45:34.199 +0200
Asset changed /styles/components/_page.scss
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Total in 429 ms

Side note: Reloading the page in the browser at this point changes the text color to red.

The problem goes away if I disable fingerprinting for CSS:

  1. In /hugo.yaml change enableAssetFingerprinting to false
  2. hugo server
  3. Repeat steps 6 - 9 from above

Setting enableAssetFingerprinting to false disables the use of | fingerprint in themes/devlog-theme/layouts/partials/css-build.html.

Now, I could simply disable fingerprinting when running as “hugo server”. However, I believe there could be a bug here.

However, my first question is: Can anyone else reproduce this behavior?