Node-sass和dart-sass

一. node-sass和dart-sass的作用

1. 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