Imposible to update cached styles on production app with CSS Isolation.

[Bartmax]

Is there an existing issue for this?

• I have searched the existing issues

Describe the bug

Using Razor Class Library and having CSS isolation, you end up with a file like:

App.styles.css

This file inside have at the very begginig the import of the isolation feature:

@import 'UILibrary.bundle.scp.css';

And you reference with a link tag and it get accesed with it's checksum like:

<link rel="stylesheet" href="/App.styles.css?v=GqIbzE0izPBAjRY8-q_8rOK0YCLsPmUezcgmh6rUIr8">

And all good, until you update the styles on the razor class library, which ends in this file: UILibrary.bundle.scp.css because that asset is heavily cached on clients like chrome and edge and because the import doesn't have any cache busting mechanism (and I don't know of any way to enforce it)

Now all your clients have the styles cached and there's no way to change the import to bust the cache, aka you cannot upgrade your app.

Expected Behavior

the import should include the hash of the file.

so

@import 'UILibrary.bundle.scp.css';

becames

@import 'UILibrary.bundle.scp.css?v=SoMeHaSh';

Steps To Reproduce

It's kind of hard to reproduce because it's easy to cache bump on localhost but you need to publish to an actual domain to see how sticky are those old values.

Exceptions (if any)

No response

.NET Version

7.0.306

Anything else?

This is a MAJOR issue, not able to update a production app without errors or maybe even being aware of it's very troublesome.

[Bartmax]

Workaround:

Enter the server and edit the published file updating the import statement to include a query string like this:

[mkArtakMSFT]

Thanks for contacting us.
Glad that you've found a workaround. We intend to address this problem by doing the work described in #47000