解决dart-sass转义伪元素中的字符集-elementUI字体图标乱码

一、问题描述

当我在scss中使用伪元素修改elementUIselect选择框的下拉图标样式时遇到一个问题：

我写的伪类content本地打包之后字符集被转义为明文，但是element原生的样式却没问题

虽然直接发布依然可以显示，但是会偶发的出现乱码。

二、解决办法

在网上查找说是dart-sass在打包过程中会将伪元素content中的内容转义。网上大多教程建议将dart-sass替换为node-sass。
elementUI官方使用的确实是node-sass

但是node-sass已经不再是主流，并且node-sass经常安装失败。
在这还有其他两种方式解决：

1.修改dart-sass配置

在vue.config中加入（加在最外层）

css: {
    // 避免dart-sass将伪元素中的字符集转义
    loaderOptions: {
      sass: {
        sassOptions: {
          outputStyle: 'expanded'
        }
      }
    }
  }

2.直接使用css

直接使用css文件进行修改，而不是scss，这样就不会被dart-sass转义了