stylus和stylus-loader使用

参考文档：https://stylus.bootcss.com/
stylus：CSS的预处理框架，即将stylus转换为css使用
stylus-loader：让webpack理解stylus

安装

npm install stylus stylus-loader --save-dev

编写使用

1）完全通过缩进控制, 可不需要大括号、分号、冒号、逗号
2）父级引用：使用字符&指向父选择器
3）通过@import 引入其它样式文件
4）定义变量最好用$开头
5）可调用mixins函数

eg.
mixins.stylus编写：

@import "res.css"
$green = #02a757;
bottom
    position relative
    background $green
    &:after
        position absolute
        
 // mixins函数
 bg-image($url)
  background-image: url($url + "@2x.png")

css调用：

<style  lang="stylus"  rel="stylesheet/stylus">
.top
     bg-image('logo')
</style>