vue 样式中的stylus

Stylus 是一款 CSS 的预处理器.点击查看详细文档

项目中如果多个地方都用的同一色值，并且有时候需要根据节日或者活动需要更改主题色即可用stylus来实现哦。

一、stylus的文件是.styl

二、style中的样式引入
	@import '~@/assets/var.styl'
	
三、stylus语法
$bg=orange

使用示例
在assets文件夹中建立theme.styl文件，设置背景色为橘色

$bg=orange

App.vue中进行使用,所有的p标签设置为橘色，如果项目中有几十个地方都用到了这个色值，将来需要改成其他的颜色，就只需要改变theme.styl中的色值即可哦~

<template>
	<div id="app">
		<div class="main">
			<p>5555555588455</p>
		</div>
	</div>
</template>
<style lang="stylus" scoped="scoped">
	@import '~@/assets/theme.styl'
	p {
		background: $bg
	}
</style>