Node-sass和dart-sass
一. node-sass和dart-sass的作用
- webpack4.0中需要sass-loader和node-sass一起安装,而webpack5.0是sass-loader和dart-sass一起
使用, 用来将sass/scss文件编译成css文件。
二. sass未来的实现
node-sass底层使用了libsass ,
libSass比起dart-sass,优点是:
(1)libSass 是C/C++ 中 Sass 的实现,易于集成到许多不同的语言中
(2) 使用c++ APi调用libSass非常快
但sass官方已经宣布弃用libSass,理由是libSass不怎么与css兼容,转而拥抱[dart-sass]
(https://github.com/sass/dart-sass/blob/main/README.md#javascript-api)
三. 从node-sass升级到dart-sass的注意事项
如果使用node-sass
复制npm install sass-loader node-sass --save-dev
如果使用dart-sass
复制npm install sass-loader sass --save-dev
这里有个注意事项, 之前使用使用node-sass中有/deep/写法,
复制/deep/ .a {
.b {
}
}
现在要换成
复制::v-deep .a {
.b {
}
}
注意: 在vue3中要弃用/deep/和>>> , ::v-deep从组合符变成一个伪元素选择器, 类似:not(.a),::v-deep在vue3中也兼容组合符写法, vue3中可以写成:deep
安装出现问题:https://www.jianshu.com/p/ed3d7409e974
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· AI与.NET技术实操系列(二):开始使用ML.NET
· 单线程的Redis速度为什么快?