node-sass升级dart-sass

背景

1.  node-sass系sass-loader依赖，但首次安装困难，尤其Windows用户，需要预装Python2与virsual studio

2. sass官方推荐dart-sass，使用新的语法来替换node-sass的旧语法

升级步骤：

1. 卸载node-sass，安装sass

2. 全局替换/deep/为::v-deep，注意/deep/.className !== ::v-deep.className ::v-deep前得加空格，即::v-deep className

3. 项目本身需要修改的地方

4. 项目技术栈vue2+ele，ele最好写死版本2.15.7，因为ele2只有2.15.7版本是dart-sass版本，之前之后都是node-sass，如果不用该版本，运行时，会有许多语法警告

5. 在定义map，并用@each循环时，map的key得确保是非色值字符串
   $colors: ($green-sub-1: $green-sub-1); @each $i, $a in $colors { .bg-#{'' + $i} { background-color: $a; }};此处会报错，因为会被解析成 .bg-#48a448: #48a448;应改成 $colors: (green-sub-1: $green-sub-1);确保key是字符串

6. align-items: start/end;会有兼容问题，产生warning，需改成align-items: flex-sart/flex-end