koenvzeijl / AspNetCore.SassCompiler

Sass Compiler Library for .NET Core 3.1/5.x/6.x/7.x without node, using dart-sass as a compiler
https://www.nuget.org/packages/AspNetCore.SassCompiler/
MIT License
208 stars 26 forks source link

dotnet watch with sass hosted watcher constantly reloads css files #176

Closed Rollerbeetle closed 5 months ago

Rollerbeetle commented 6 months ago

Describe the bug When running the app with hosted compiler and dotnet watch, the app will constantly reload static css

To Reproduce Steps to reproduce the behavior:

  1. Download this repo
  2. Navigate to the blazor sample app
  3. Run the app in watch mode: 'dotnet watch run'
  4. See that the app constantly reloads css because the file is changed

Expected behavior I expected the css files to only change when the sass process actually recompiles them.

Screenshots If applicable, add screenshots to help explain your problem. image

Additional context/Thoughts. I'm not sure what can actually be done, or if this is an issue with the sass versions you are using. When looking at the css files, it seems to me that the sass process does change the "last modified" etc.

Unsure if it would be possible to use a File Watcher and start the sass process when it detects errors instead. If thats not viable, and/or the issue is with the Sass binary, maybe just add a note to readme

sleeuwen commented 6 months ago

Hi @Rollerbeetle , Thanks for the detailed description and reproduction steps, I was able to reproduce the issue and it looks like this happens because when the css is changed it will trigger another MSBuild target, which our MSBuild target also indirectly has listed in the BeforeTargets attribute. So when it's doing the hot reload for a scoped css file it will rerun the sass compiler via the msbuild task, which will update the css file, and so on. I'll try to figure out what the best way is to avoid this.

sleeuwen commented 6 months ago

After further investigation, it actually seems to be an issue with dart-sass itself. In the MSBuild task we specify the --update flag, so it should only recompile the file if the scss file has actually changed (so for a hot reload triggered by the watch process it should never have to do anything). This does not seem to work correctly when specifying an absolute path for the source though, which we do.

I've filed an issue for this in the dart-sass repo sass/dart-sass#2199 , I'll wait for what they'll come back with before making any changes.

Rollerbeetle commented 5 months ago

Looks like they fixed it :) After updating to newest where you updated the sass version i no longer have the issue 👍