安装和使用
npm install sass-loader node-sass --save
这时候安装完就可以在组件中使用scss
了。
<style scoped lang="scss">
.wrap {
h1{
color:blue;
}
}
</style>
引入SCSS全局变量
_variable.scss
$color-theme:#498eff;
如果想要使用scss
变量的话,需要对配置文件做如下修改
vue.config.js
css: {
loaderOptions: {
sass: {
prependData: `@import "~@/assets/scss/_variable.scss";`
}
}
}
修改完配置文件记得重启下项目,接下来就可以使用scss
变量,函数等功能了。
<style scoped lang="scss">
.wrap {
h1{
color:$color-theme;
}
}
</style>
网友评论