element-plus修改主题色@forward rules must be written before any other rules

出现的问题

• 需要让@forward在最前面。

syntax error: sasserror: @forward rules must be written before any other rules

环境

• 用的vue-cli建的vue3

"element-plus": "^1.3.0-beta.5",
"sass": "^1.46.0",
"sass-loader": "^10.0.5"

步骤

• 我按照官方文档进行操作
• 结果报错

解决

• 原因 是vue.config.js本地sass全局变量影响到了element/index.scsss

我用的是dart-sass,所以在vue.config.js

//全局sass文件
loaderOptions{
    sass: {
          additionalData: `
            @import "src/assets/scss/entrance.scss"; //自己的样式文件
            @import "src/assets/scss/element/index.scss"; //element的样式文件
          `
        },
}

这样就可以解决