迁移到 .NET 5.0 并使用 SASS 后,Blazor CSS Isolation 不起作用且未添加范围标识符 [英] Blazor CSS Isolation not working and not adding scope identifiers after migrating to .NET 5.0 and using SASS
问题描述
我最近将一个宠物项目从 Blazor .NET 3.1 迁移到了 .NET 5.0,并且正在尝试切换到使用 css 隔离.
I've recently migrated a pet project from Blazor .NET 3.1 to .NET 5.0 and am trying to switch to using css isolation.
我创建了一个 scss 文件(它使用 webcompiler 扩展编译成一个 css 文件),其前缀与我的组件相同:
I've created a scss file (which compiles to a css file using the webcompiler extension) with the same prefix as my component:
我已将生成的 css 包含在我的 index.html 文件中:
I've included the generated css in my index.html file:
<link href="FinNodeWASM.Client.styles.css" rel="stylesheet">
Dotnet 正在正确生成 css 并按预期附加范围标识符属性:
Dotnet is generating the css correctly and appending the scope identifier attribute as expected:
但是,当我查看生成的 HTML 时,我在那里没有看到预期的分数标识符属性:
However, when I look at the generated HTML I don't see the expected score identifier attribute there:
推荐答案
我在升级一个简单的项目时遇到了同样的问题.我比较了一个新创建的 Blazor csproj 文件并删除了 RuntimeIdentifier 和 RazorLangVersion 为我修复了它.
I was having the same issue when upgrading a simple project. I compared a newly created Blazor csproj file and deleting the RuntimeIdentifier and RazorLangVersion fixed it for me.
<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
<PropertyGroup>
<TargetFramework>net5.0</TargetFramework>
*** DELETE THIS LINE *** -> <RuntimeIdentifier>browser-wasm</RuntimeIdentifier>
*** DELETE THIS LINE *** -> <RazorLangVersion>3.0</RazorLangVersion>
</PropertyGroup>
<ItemGroup Condition="'$(TargetFramework)' == 'net5.0' ">
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="5.0.0-*" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="5.0.0-*" PrivateAssets="all" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Authentication" Version="5.0.0-*" />
<PackageReference Include="Microsoft.Authentication.WebAssembly.Msal" Version="5.0.0-*" />
<PackageReference Include="System.Net.Http.Json" Version="5.0.0-*" />
</ItemGroup>
</Project>
这篇关于迁移到 .NET 5.0 并使用 SASS 后,Blazor CSS Isolation 不起作用且未添加范围标识符的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!