eleventy-dev-server
eleventy-dev-server copied to clipboard
11ty
Trigger reload on css change
We’re using paged.js to make PDF from the web.
The way paged.js work is a bit different from the normal web, as it pull all the stylesheet into a couple of style element (after modifying them a bit).
This means that when we update a css, we need to have a full reload and not a css update, a proper full reload.
It looks like from here that the CSS doesnt trigger a reload.
would it be possible to add a config key to force a page reload, even on css update?
Made a workin example (with (what i think) is a very dirty code, but wanted to see how complex that was.
https://github.com/11ty/eleventy-dev-server/compare/main...julientaq:eleventy-dev-server:main
i’m passing the value of the argv.cssforcereload to the browser before loading the client js, and check that value to trigger a css rebuild (or keep the previously working setup).
i’m a bit bothered because the linter did its own thing and made the commits a bit harder to follow. I couldn’t find any options for writing code styles @zachleat.
Did i completely missed it?
Tell me if you think that is worth a PR. (also, i assume that we’ll need to push that option to eleventy in a second movement).
just tested with my setup, and it’s working amazingly well with incremental.
(again, 11ty is the most interesting piece of web dev i’ve ever seen, thanks for all the work).
Sorry about this folks! I completely misunderstood the issue in play here (for quite awhile)!
The fix for this will ship with Eleventy Dev Server 2.0.7 (but also will require core changes available in Eleventy v3.0.1-alpha.5 or newer).
The change made is this: when a CSS change is in play, we scan the <link rel="stylesheet"> nodes to see if one of them matches the CSS files changed to trigger the build. If none are found, we initiate a full page refresh (prior behavior was to do nothing, which was a big mistake!)
