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