Elderjs / elderjs

Elder.js is an opinionated static site generator and web framework for Svelte built with SEO in mind.
https://elderguide.com/tech/elderjs/
MIT License
2.12k stars 53 forks source link

Changes from @import-ed CSS files are not applied #231

Open kucrut opened 2 years ago

kucrut commented 2 years ago

Even after reloading the browser, changes from CSS files that are @import-ed from <style> tags are not applied, until the svelte file is saved. I can confirm that the issue is happening on MacOS & (Arch) Linux.

Below is a video demonstrating it on vanilla Elder template.

https://user-images.githubusercontent.com/67838/148091446-0d113539-0f7e-4e08-aada-ba531a591422.mp4

eight04 commented 2 years ago

I think the @import statement is processed by clean-css: https://github.com/Elderjs/elderjs/blob/162972ccdbad7f5569096bd5794cd59271c6004a/src/rollup/rollupPlugin.ts#L293-L304 Which is called after the build.

To fix this, we have to process @import statement in the transform function and set imported files as dependencies.