using csz's file import in snowpack setup breaks the dev server's hmr. about csz HOT 6 CLOSED

Sure thing.
i have put this same question on pika discuss also .i'm sure the moderators will have say in this. meanwhile i'll learn about es-module-shims.

from csz.

Ahh cool. So maybe my assumptions about HMR getting all its graph data from parsing code wasn't correct then 😅

Regards relative links, it wasn't really a choice either! This was due to lack of support for import.meta which allows you to infer the location of the location of the calling script. From there you can build up relative paths.

Until then I think we are stuck with absolute links.. but I would be interesting in seeing an implementation ready for when import meta is standardised!

from csz.

Hey 👋 thanks for investigating this!

Unfortunately this is a side effect of HMR relying on getting its file graph data from parsing actual imports (which is generally a good thing) and csz using a completely custom import syntax (uses template literal and fetch instead, as importing css is not yet supported by the browser).

I'm not sure what to suggest here, until dynamic import of CSS becomes standard then we have to think of a call for an external file like this as a fetch request (which wouldn't normally cause a refresh).

Does refreshing the page not cause the styles to update. Unless HMR is caching fetch requests then you shouldn't have to restart the server entirely. Not an idea solution I know, but slightly better!

from csz.

Thanks for replying quickly.

unfortunately refreshing browser doesn't work :(
however i will check this, if there's a way to configure snowpack to cache fetch request.

Nice little library though. very impressive work!! 💯

from csz.

No worries! It is an interesting problem.. I know that there is a shim for css imports in https://github.com/guybedford/es-module-shims but I am not sure how that will play with snowpacks build either 🤷‍♂️

Let me know if you get to the bottom of it.. otherwise perhaps we can consult one of the snowpack folk or my colleague who implemented the hot module reloading for snowpack.

from csz.

okay.. i feel bit embarrassed now. found that the problem is something unrelated to csz and snowpack. the initials of folder were css are located were in capital n i had put lowercase folder. 🙈 🤦‍♂️

this raises another question in my mind. if csz could handle relative imports, problems like i had would be less likely to happen.if there's a way to put relative path inside csz's string literal .. as in large projects where components can be situated deep inside folder structures, developer will not have to put full absolute path like this

const style = css`/_dist_/components/Landing/Landing.css` 

but instead have something like this

const style = css`/./Landing.css`

first slash is necessary i guess to distinguish the inline css and css file.
ill give a try to incorporate relative imports in csz and send a PR. unless they were some reasons which restricted you to have relative imports in first place.

from csz.