stylus--安装及使用方法

stylus介绍

Stylus 是一个CSS的预处理框架，2010年产生，来自Node.js社区，主要用来给Node项目进行CSS预处理支持，所以 Stylus 是一种新型语言，可以创建健壮的、动态的、富有表现力的CSS。比较年轻，其本质上做的事情与 SASS/LESS 等类似，应该是有很多借鉴，所以近似脚本的方式去写CSS代码。

Stylus默认使用 .styl 的作为文件扩展名，支持多样性的CSS语法。

Stylus功能上更为强壮，和js联系更加紧密。

stylus文件后缀是 .styl

stylus安装

   当然，首先你得安装node.js运行环境

$ npm install -g stylus

运行stylus -h 可以获得相关的命令行支持

 

自动化编译

1. 新建src文件夹
2. 新建example.stly文件
3. 打开命令行界面
4. 输入 stylus -w example.styl -o src
   -w 是自动监视文件 -o 是将编译后的CSS文件输出到指定文件中
5. 在example.styl里面写内容，保存即可

6. 压缩

7. $ stylus --compress src/

   输出compiled src/example.css ，这个时候表示你生成成功了，带上--compress参数表示你生成压缩的CSS文件。

   $ stylus --css css/example.css css/out.styl CSS转换成styl 
   $ stylus help box-shadow CSS属性的帮助 
   $ stylus --css test.css 输出基本名一致的.styl文件