在尝试使用Vue CLI3官方方法引入全局SCSS变量时遇到错误。在vue.config.js中设置css.loaderOptions.sass.data为`@import "~@/assets/scss/variables.scss"`，但构建时报错，错误信息提示Sass Loader初始化的options对象不匹配API schema，发现未知属性'data'。问题可能出在Sass Loader配置上。
我使用官方文档提供的配置sass全局变量，但是报错！
‘;’还有官方强调的“~”都没落；
vue.config.js代码如下：
module.exports = {
css: {
loaderOptions: {
sass: {
data: `@import "~@/assets/scss/variables.scss";`,
},
}
}
}
variables.scss的代码如下：
$color:#fff;
组件代码如下：
// $tcolor:red;
.title{
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 40px;
background-color: cornflowerblue;
} .title p {
width: 100%;
height: 100%;
line-height: 40px;
text-align: center;
font-size: 20px;
color: $color;
}
报错内容如下：
error in ./src/components/header.vue?vue&type=style&index=0&lang=scss&am
最低0.47元/天 解锁文章
720
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
