.NetCoreMVC 开发网页使用sass

sass在前端中可以进行全局设置变量,对前端开发有一定便捷。

1.安装<PackageReference Include="AspNetCore.SassCompiler" Version="1.93.2" />

2.进行配置,在项目目录下添加sasscompiler.json文件。

3.选取的在添加下图内容。

默认源是./Styles文件夹里的scss,运行生成输出到wwwroot/css里,

如果你还有其他地方的.scss文件,可以在"Compilations": 中指定。

4.你只需要在网页里引用生成的 CSS(比如 <link href="~/css/style.css" ...>)就行了。

例子:我只有Styles下的variable.scss文件。

就配置如下

开发时实时修改(如果配置了实时监听):在 Program.cs 里加了 builder.Services.AddSassCompiler(); 后,修改 .scss 文件并保存,会立即自动重新编译,刷新网页就能看到效果(不用重新构建项目)。

官方例子:AspNetCore.SassCompiler/Samples/AspNetCore.SassCompiler.Sample at master · koenvzeijl/AspNetCore.SassCompiler

相关推荐
宝桥南山3 天前
Microsoft Agent Framework(MAF) - 如何将workflow或者A2A client转换成一个AI Agent
microsoft·ai·微软·aigc·.net·.netcore
滴滴答答哒13 天前
.NET Core 基于 AOP + Polly 实现数据库死锁自动重试
数据库·.netcore·sqlsugar
暗冰ཏོ15 天前
CSS 超详细讲解(从基础到高级实战)
前端·css·css3·sass·scss
.NET修仙日记16 天前
.NET EFCore批量插入性能优化实战:30秒 → 0.5秒
性能优化·c#·.net·.netcore·微软技术·efcore·踩坑实录
Kimhill张19 天前
.net core8 WPF 依赖注入(DI)
wpf·.netcore
wangl_9220 天前
C# / .NET 在工业环境中的优势
开发语言·c#·.net·.netcore·.net core·visual studio
豆豆23 天前
信创环境下CMS国产化适配实践:以.NET Core路线为例的技术验证
.netcore·cms·信创·国产化·建站系统·内容管理系统·网站管理系统
时光追逐者23 天前
C#/.NET/.NET Core技术前沿周刊 | 第 70 期(2026年5.01-5.10)
c#·.net·.netcore
腾讯蓝鲸智云24 天前
【运维自动化-节点管理】节点管理的插件策略如何使用
运维·自动化·云计算·sass·paas
林叔聊渠道分销1 个月前
saas产品运营案例 | 联盟营销计划如何帮助企业提高销售额?
运维·产品运营·sass·流量运营·用户运营