前提
已引用并使用scss
npm install sass-loader --save-dev
npm install node-sass --sava-dev
配置
在vue.config.js中
module.exports = {
css: {
loaderOptions: {
sass: {
prependData: `@import "@/styles/index.scss";`
}
}
}
};
子组件调用
<style scoped lang="scss">
.page-container {
display: flex;
flex-direction: row;
padding: 16px;
background: $background;
}
</style>
不生效或报错原因的解决
1、重启项目
本文来自博客园,作者:无聊猿,公众号【无聊猿】,转载请注明原文链接:https://www.cnblogs.com/wuliaoyuan/p/15579635.html