.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

相关推荐
小先生8126 天前
.NET Core后台任务队列
.net·.netcore
MoFe16 天前
【.net core】【watercloud】动态数据转换为静态表格,或者表格数据返回需要后处理
.netcore
会跑的葫芦怪7 天前
SaaS点餐平台难点详细解决方案
spring boot·sass
豆豆7 天前
如何通过PageAdmin完成网站上线并设置SEO关键词
cms·网站建设·网站制作·sass·建站系统·建站平台·自助建站
AI_56789 天前
Sass代码优化:混合宏+占位符提升CSS可维护性
人工智能·sass
吹牛不交税12 天前
.netcore项目部署在ubuntu22.04虚拟机的docker中的过程记录
docker·容器·.netcore
feasibility.14 天前
打造AI+准SaaS:中文法律检索分析平台
vue.js·人工智能·自然语言处理·django·sass·web·法律
豆豆15 天前
CMS:从零开始构建内容管理系统
cms·sass·建站系统·建站平台·自助建站·内容管理系统·网站管理系统
weixin_4219947815 天前
基于 .NET 9.0 的高性能轻量级令牌桶限流服务
.net·.netcore·令牌桶
weixin_4219947815 天前
MVC 模式初探
mvc·.net·.netcore