dotnet / aspnetcore

ASP.NET Core is a cross-platform .NET framework for building modern cloud-based web applications on Windows, Mac, or Linux.

Home Page:https://asp.net

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Sass support with dotnet watch

uecasm opened this issue · comments

Is there an existing issue for this?

  • I have searched the existing issues

Is your feature request related to a problem? Please describe the problem.

My current specific problem is that I want to use SASS (specifically, Component.razor.scss files) in my Blazor WebAssembly projects. I have already managed to make this work for regular builds and dotnet watch full rebuilds by adding this to my project:

<PropertyGroup>
    <LibSassOutputStyle>compressed</LibSassOutputStyle>
    <LibSassOutputStyle Condition="'$(Configuration)' == 'Debug'">expanded</LibSassOutputStyle>
</PropertyGroup>
<ItemGroup>
    <PackageReference Include="LibSassBuilder" Version="2.0.1" />
</ItemGroup>
<ItemGroup>
    <Content Remove="**/*.scss" />
    <SassFile Update="**/*.scss" CopyToPublishDirectory="Never" />
</ItemGroup>
<Target Name="BuildScopedSass" BeforeTargets="ResolveScopedCssInputs" DependsOnTargets="LibSass_Build">
    <ItemGroup>
        <!-- Clean the metadata for these files -->
        <None Remove="**/*.razor.css" />
        <None Include="**/*.razor.css" />
    </ItemGroup>
</Target>

This builds the CSS files in the right places and everything just seems to work -- for full builds. (Although with the caveat that you need to put them into .gitignore, since it doesn't appear to be possible to build them to an intermediate directory instead.)

But with a dotnet watch running, editing and saving the .scss file is just seen as a "static file" and it reloads without actually building the CSS files, so I have to force a full rebuild.

Describe the solution you'd like

This is mostly a repeat of #39609 (which was closed and locked from lack of discussion, so I am posting a new issue as the bot requested).

It would be good to get some documentation on how to integrate additional tools with the hot reload process, either via tools that have their own built-in watch functionality or (probably simpler) via some project rules that can express "if these file patterns change then run this build command/target before reloading"; or just a documented target that can be hooked to run additional build targets, perhaps conditionally on the changed file list. The expectation is that these would mostly be for static assets, but perhaps source generators could be supported too?

Or alternatively, to just include sass support as a first-class citizen (which is #24420). But then this question will come up again next time someone wants to use some other tool.

Additional context

No response

We've moved this issue to the Backlog milestone. This means that it is not going to be worked on for the coming release. We will reassess the backlog following the current release and consider this item at that time. To learn more about our issue management process and to have better expectation regarding different types of issues you can read our Triage Process.