Live-Reload not serving changed JS file

DanielBarker · May 27, 2025, 1:20pm

I have a draft page which includes some JavaScript for a visualization. The JavaScript file sits next to the post’s index.md.

I am viewing the draft with

hugo server --disableFastRender --printPathWarnings -D -F

This is correctly noticing when the JavaScript file changes and logs to say it’s rebuilding the site, but when I refresh the page the original JavaScript is still there (the file under public/ is still the old file).

Am I doing something wrong or is this unexpected behaviour?

For reference, this is on Ubuntu 24.04.2 and Hugo 0.147.5.

bep · May 27, 2025, 2:09pm

I would highly recommmend dropping the --disableFastRender flag, but you “insist”, there was a related bug fix in this release: Release v0.147.6 · gohugoio/hugo · GitHub

DanielBarker · May 27, 2025, 2:20pm

Thanks for the quick reply.

Unfortunately neither changing --disableFastRender, nor updating to 0.147.6 changes the behaviour. In order to see the updated JS I have to restart hugo server and refresh the browser.

bep · May 27, 2025, 3:05pm

There’s not enough details about what you’re doing for me to say. How do you include/build your JS file? Showing some. template (or better: the entire project) would help.

In general, I would say that I’m doing lots of what you’re doing and it work great … for me.

irkode · May 27, 2025, 4:02pm

Just curious I played a little bit

I get that effect if I

put a page resource page.css aside the index.md
directly include the CSS file in baseof using <link rel="stylesheet" href="page.css" />

that way, a change to the page.css is detected, but it’s not published again.

if I

use it as a page resource page.Resources.Get "page.css" and it’s .RelPermalink it works.

looks like:

simple resource files at page level are just published once (regardless if they are linked)

change is detected but no publish is triggered

same for a json file, so not css specific

adding a new file to the page bundle will publish the file. Changing the content after will not republish the file

BUT hugo server -w 500 will detect the change and update the file in public. Manually refreshing the browser will update the style.

for a simple file this is printed as last line
```
INFO  livereload: build changed 0 files: []
```

for a resource (.Relpermalink) it prints these:

INFO  livereload: build changed 1 files: ["\\posts\\post-3\\page.css"]
INFO  livereload: no page to navigate to, force refresh
INFO  livereload: refreshing CSS "/posts/post-3/page.css"

tested

* without draft mode,
* with and without --disablefastRender, 
* Windows 11
* Hugo 147.6

Full Log (for file)

hugo server --logLevel debug
Watching for changes in C:\_repos\github\clone\topic-54873-updateJS\{archetypes,assets,content,data,i18n,layouts,static}
Watching for config changes in C:\_repos\github\clone\topic-54873-updateJS\hugo.toml
Start building sites …
hugo v0.147.6-0a5fd8ebb8e2ca798515e8c564c14e32db3b4127+extended windows/amd64 BuildDate=2025-05-27T11:17:16Z VendorInfo=gohugoio

INFO  static: syncing static files to \ duration 519.7µs
INFO  build:  step process substep collect files 9 files_total 9 pages_total 5 resources_total 4 duration 519.7µs
INFO  build:  step process duration 1.0472ms
INFO  build:  step assemble duration 1.04ms
INFO  build:  step render substep pages site en outputFormat html duration 7.7133ms
INFO  build:  step render substep pages site en outputFormat rss duration 1.6136ms
INFO  build:  step render pages 18 content 10 duration 11.3958ms
INFO  build:  step render deferred count 0 duration 0s
INFO  build:  step postProcess duration 0s
INFO  build:  duration 14.0044ms

                   | EN
-------------------+-----
  Pages            | 18
  Paginator pages  |  0
  Non-page files   |  4
  Static files     |  1
  Processed images |  0
  Aliases          |  0
  Cleaned          |  0

Built in 17 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
DEBUG Received System Events: [WRITE         "C:\\_repos\\github\\clone\\topic-54873-updateJS\\content\\posts\\post-3\\page.css" WRITE         "C:\\_repos\\github\\clone\\topic-54873-updateJS\\content\\posts\\post-3\\page.css"]

Change detected, rebuilding site (#1).
2025-05-27 17:49:54.169 +0200
DEBUG cachebuster: Matching "content/posts/post-3/page.css" with source "(postcss|tailwind)\\.config\\.js": no match
Source changed /posts/post-3/page.css
DEBUG Direct dependencies of "/posts/post-3/page.css" (*resources.genericResource /posts/post-3/page.css) =>
INFO  build:  step process substep gc dynacache duration 0s
INFO  build:  step process substep resolve page output change set changes 1 checked 32 matches 0 duration 0s
INFO  build:  step process substep collect files 1 files_total 1 pages_total 0 resources_total 1 duration 0s
INFO  build:  step process duration 2.1339ms
INFO  build:  step assemble duration 0s
INFO  build:  step render substep pages site en outputFormat html duration 0s
INFO  build:  step render substep pages site en outputFormat rss duration 0s
INFO  build:  step render pages 0 content 0 duration 522.4µs
INFO  build:  step render deferred count 0 duration 0s
INFO  build:  step postProcess duration 0s
INFO  build:  duration 3.4603ms
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Total in 3 ms
INFO  livereload: build changed 0 files: []

Full Log (resource)

hugo server --logLevel debug
Watching for changes in C:\_repos\github\clone\topic-54873-updateJS\{archetypes,assets,content,data,i18n,layouts,static}
Watching for config changes in C:\_repos\github\clone\topic-54873-updateJS\hugo.toml
Start building sites …
hugo v0.147.6-0a5fd8ebb8e2ca798515e8c564c14e32db3b4127+extended windows/amd64 BuildDate=2025-05-27T11:17:16Z VendorInfo=gohugoio

INFO  build:  step process substep collect files 9 files_total 9 pages_total 5 resources_total 4 duration 1.0978ms
INFO  build:  step process duration 1.0978ms
INFO  static: syncing static files to \ duration 1.0978ms
INFO  build:  step assemble duration 1.0636ms
WARN  no page.css resource found at /tags
WARN  no page.css resource found at /tags/red
WARN  no page.css resource found at /tags/blue
WARN  no page.css resource found at C:/_repos/github/clone/topic-54873-updateJS/content/posts/_index.md
WARN  no page.css resource found at /tags/green
WARN  no page.css resource found at C:/_repos/github/clone/topic-54873-updateJS/content/_index.md
WARN  no page.css resource found at /categories
WARN  no page.css resource found at C:/_repos/github/clone/topic-54873-updateJS/content/posts/post-2.md
WARN  no page.css resource found at C:/_repos/github/clone/topic-54873-updateJS/content/posts/post-1.md
INFO  build:  step render substep pages site en outputFormat html duration 8.0378ms
INFO  build:  step render substep pages site en outputFormat rss duration 1.0524ms
INFO  build:  step render pages 18 content 10 duration 9.6147ms
INFO  build:  step render deferred count 0 duration 0s
INFO  build:  step postProcess duration 0s
INFO  build:  duration 12.2952ms

                   | EN
-------------------+-----
  Pages            | 18
  Paginator pages  |  0
  Non-page files   |  4
  Static files     |  1
  Processed images |  0
  Aliases          |  0
  Cleaned          |  0

Built in 13 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
INFO  build:  step render substep pages site en outputFormat html duration 0s
INFO  build:  step render substep pages site en outputFormat rss duration 528.2µs
INFO  build:  step render pages 0 content 0 duration 528.2µs
INFO  build:  step render deferred count 0 duration 0s
INFO  build:  step postProcess duration 0s
INFO  build:  duration 1.7885ms
DEBUG Received System Events: [WRITE         "C:\\_repos\\github\\clone\\topic-54873-updateJS\\content\\posts\\post-3\\page.css" WRITE         "C:\\_repos\\github\\clone\\topic-54873-updateJS\\content\\posts\\post-3\\page.css"]

Change detected, rebuilding site (#1).
2025-05-27 17:54:46.786 +0200
DEBUG cachebuster: Matching "content/posts/post-3/page.css" with source "(postcss|tailwind)\\.config\\.js": no match
Source changed /posts/post-3/page.css
DEBUG Direct dependencies of "/posts/post-3/page.css" (*resources.genericResource /posts/post-3/page.css) =>
INFO  build:  step process substep gc dynacache duration 0s
INFO  build:  step process substep resolve page output change set changes 1 checked 32 matches 1 duration 0s
INFO  build:  step process substep collect files 1 files_total 1 pages_total 0 resources_total 1 duration 0s
INFO  build:  step process duration 2.1142ms
INFO  build:  step assemble duration 0s
INFO  build:  step render substep pages site en outputFormat html duration 1.0499ms
INFO  build:  step render substep pages site en outputFormat rss duration 0s
INFO  build:  step render pages 1 content 0 duration 1.5743ms
INFO  build:  step render deferred count 0 duration 0s
INFO  build:  step postProcess duration 0s
INFO  build:  duration 4.7305ms
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Total in 4 ms
INFO  livereload: build changed 1 files: ["\\posts\\post-3\\page.css"]
INFO  livereload: no page to navigate to, force refresh
INFO  livereload: refreshing CSS "/posts/post-3/page.css"

bep · May 27, 2025, 5:26pm

Please create a GitHub issue about this, but the above seems odd. I would however recommend using the Resource abstraction. This is is especially true if you use global resources or resources inside “other bundles”. To determine what to rebuild/rerender, Hugo looks at who “uses this page/resource”, and usage comes from calling methods on a page/resource (e.g. .RelPermalink).

For JS files, I would also recommend using the functions in the js namespace (e.g. js.Build).

irkode · May 27, 2025, 6:29pm

please confirm the use case i described matches yours?

if not please post more details on yours.

irkode · May 27, 2025, 8:23pm

github.com/gohugoio/hugo

Live-Reload wont update changed page resources published by build options when not processed by resource methods.

opened 08:19PM - 27 May 25 UTC

irkode

Bug NeedsTriage

based on the analysis in https://discourse.gohugo.io/t/live-reload-not-serving-c…hanged-js-file/54873/6?u=irkode A simple page resource in a bundle is by default copied verbatim to the public directory. (unless disabled by build options) When running Hugo server the resource is copied verbatim. Changing the content of that particular file makes the server detect a change, but the file is not updated in public folder. Content type seems to be irrelevant (tested with .json and .css). ``` Source changed /posts/post-3/page.css ... INFO livereload: build changed 0 files: [] ``` when using the file as a real page resource and publishing with `.RelPermalink` the output changes and the file in public is updated. Also the livereload works, In case of a css change the change is visible imediately. ``` Source changed /posts/post-3/page.css ... INFO livereload: build changed 1 files: ["\\posts\\post-3\\page.css"] INFO livereload: no page to navigate to, force refresh INFO livereload: refreshing CSS "/posts/post-3/page.css" ``` using `hugo server -w 500 also updates the file in public (but the page has to be refreshed in the browser manually) Condition: A page resource (simple file) that is published because of build settings (which is the default). This is not handled by any resource function or publishing action. Expectation: `hugo server` (livereload) should update published file in public when the source file in content is changed. As @bep said: > To determine what to rebuild/rerender, Hugo looks at who “uses this page/resource”, and usage comes from calling methods on a page/resource So we have another case > a page resource should also be published if the above is false and it has been published by build settings before. ### What version of Hugo are you using (`hugo version`)? <pre> hugo v0.147.6-0a5fd8ebb8e2ca798515e8c564c14e32db3b4127+extended windows/amd64 BuildDate=2025-05-27T11:17:16Z VendorInfo=gohugoio GOOS="windows" GOARCH="amd64" GOVERSION="go1.24.0" github.com/sass/libsass="3.6.6" github.com/webmproject/libwebp="v1.3.2" github.com/sass/dart-sass/protocol="3.1.0" github.com/sass/dart-sass/compiler="1.83.4" github.com/sass/dart-sass/implementation="1.83.4" </pre> ### Does this issue reproduce with the latest release? yes

definitely true, but there might be special cases where we want to have a file in a published folder without any processing (.htaccess, some config for a cgi, server configs… ) ok. It’s just a copy pase action to get the file there. on the other hand, one would need to template it or create a shortcode.

DanielBarker · May 27, 2025, 9:41pm

Yeah I think you caught the case I have. The .js sits alongside the index.md then inside that I have a <script type="module" src="/posts/post-url/example.js"></script>. Thanks!

I actually had a question about how to make this url not hard-coded so I guess that’s the resource thing. What’s the canonical way to use that inside the markdown? I could create a shortcode that basically just calls pages.Resources.Get for me, but is that idiomatic?

bep · May 28, 2025, 8:55am

Why would you use it inside Markdown?

As to documentation , see https://gohugo.io/

chrillek · May 28, 2025, 9:41am

To elaborate on @bep’s question: I’d rather load JS code in a partial than in an MD file. For example, you could set a front matter parameter if yoou need the JS and then in your single.html (or page.html?) load the code if the parameter is present.

Having a script element in the middle of your HTML might also not be the best thing performancewise.

bep · May 28, 2025, 10:01am

As to the bug reported in this issue, that will be fixed in Make sure that unreferenced but changed bundle resources gets republished by bep · Pull Request #13751 · gohugoio/hugo · GitHub

DanielBarker · May 28, 2025, 10:17am

My content is in a Markdown file, but in the midst of that I have a canvas element I’m animating. I don’t want to create a new shortcode for every article where I have some HTML among the Markdown.

Yes, thanks. I have perused the docs. They are very good, but being as extensive as they are it’s not always easy to find the right concept / page.

system · May 30, 2025, 10:18am

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

Topic		Replies	Views
Reload not affecting Javascript resources support	4	499	July 14, 2020
Site is only built correctly when being live-reloaded support	3	638	June 3, 2018
Live reload broken support	14	6765	March 29, 2020
Live reloading css does not work with cached disabled support	4	258	February 11, 2024
Server Not Updating JavaScript on File Change support	9	416	July 8, 2024

Live-Reload not serving changed JS file

Related topics