Vue中使用stylus编写样式代码

HTML/CSS 2019-03-25 2833 0
08:31:16

Vue中使用stylus编写样式代码

使用stylus语法编写样式代码,熟练后可以大大提高我们的开发效率,而且里面还有很多特性,比如:冒号可选,分号可选,花括号可选以及变量等等。

安装

npm install stylus --save

npm install stylus-loader --save

使用

在开发中,我们会遇到一些需要复用的属性,比如background等等,这时我们可以创建一个.styl后缀的文件,在styl文件里面这样写:

$bgColor = #00bcd4;

引入该文件,并在使用的地方写:

background:$bgColor

我们还可以在styl文件里写:

ellopsis()

overflow: hidden

white-space: nowrap

text-overflow: ellipsis

在使用的地方,直接写上即可:

ellopsis()

更多技巧有待开发

 

发表评论