我们在开发时可能会有需求根据当前vue的环境变量进行样式区分,说白了就是如何在sass中进行if else,下面将是我的处理方法。
首先在webpack -> utils.js 中将环境变量定义:
然后在sass文件中使用:
div {
@if ($env == 'production') {
height: calc(100vh - 332px); // 生产环境展示
} @else {
height: calc(100vh - 412px); // 开发环境展示
}
}
这样就可实现css根据开发环境进行样式编写了。