在VueCli3创建的项目里使用SCSS全局变量
1. 准备存放全局样式变量的文件
global-variable.scss，内容如下：
$theme-color: #3385ff;
2. 配置loader
打开根目录下 vue.config.js
module.exports = {
// ...
css: {
loaderOptions: {
sass: {
data: `@import "@/assets/styles/_variable.scss";`
}
}
}
}
3. 使用全局变量
现在就可以在每个vue文件中直接使用全局变量了
<template>
<div>
</div>
</template>
<script>
exprot default {
}
</script>
<style lang="scss" scoped>
button{
color: $theme-color;
}
</style>
