.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

相关推荐
淡海水1 小时前
10-01-互操作-C#与C++边界的内存管理
unity·c#·游戏引擎·.netcore·gc
1-1=05 小时前
C# 反射
c#·.net·.netcore
1-1=01 天前
C# 泛型
c#·.net·.netcore
淡海水3 天前
09-01-内存-Unity资源生命周期全景
unity·c#·游戏引擎·.netcore·gc
1-1=03 天前
.NET Core 编译技术
.net·.netcore
1-1=04 天前
.NET Core 文件系统
.net·.netcore·1024程序员节
1-1=05 天前
.NET Core 内存管理
.net·.netcore
1-1=05 天前
.NET Core 配置与选项
.net·.netcore·1024程序员节
柏慧通云报餐7 天前
政企清廉食堂数字化建设方案:基于一体化报餐平台的全链路管控落地思路
大数据·运维·人工智能·物联网·sass
淡海水7 天前
08-02-优化-LINQ与函数式编程的GC代价
unity·c#·.netcore·linq·gc