如何在 Blazor 中使用 Sass？

Question

我在MS DOC中找到了关于Razor中CSS的内容。但它不能与Scss文件一起使用。

我通过创建两个文件：css和scss来解决这个问题。并使用sass --watch命令。但每次创建新组件时都需要编写这些命令。

- Roman Nichi

Answer 1

很遗憾，SASS目前不支持Blazor的CSS隔离功能。至少目前是这样。

在我们的项目中，我们使用CSS隔离来实现CSS组件隔离功能，但我们使用SASS文件来管理主题，以便在整个应用程序中使用所需的样式。

话虽如此，如果您确实需要为某个独特的组件使用SASS，则完全可以通过添加一个带有指定ID的包装器来实现，然后在您的scss文件中使用此ID，并为其指定一个专用名称，例如MyComponent.scss。

此外，我找到了这篇文章，但我更喜欢不使用它，因为设置有点麻烦，但由您决定：https://joren-thijs.medium.com/how-to-add-scss-support-to-blazor-cd2a62995441

- Dylan El Bar

Answer 2

您可以使用AspNetCore.SassCompiler，它支持普通和隔离的scss。我相信它在使用Blazor Server时具有观察模式，但尚不支持WASM。

它还可以进行带源映射的缩小。

- Axekan

Answer 3

我尝试了各种方法来将Sass编译为CSS... 在我看来，最快的方法是使用WebCompiler（Visual Studio扩展），但我不知道它是否是最好的。

- Iggy88

---

有任何关联吗？[/help/promotion] - undefined