zoukankan      html  css  js  c++  java
  • Stylus

    Stylus是一个CSS预处理器
    那么在SaaS,Less和Stylus中,为什么选择后者呢?

    因为Stylus是来源于Node.js社区,与js关系密切,所以基于Vue.js的开发,我们选择使Stylus。
    1.配置Stylus环境

    npm install stylus --save-dev
    npm install stylus-loader --save-dev
    npm run dev

    2.

         --save-dev  是将模块安装到项目目录下,并在package文件的devDependencies节点写入依赖。

         devDependencies 节点下的模块是我们在开发时需要用的,比如本次安装的css预处理器stylus。这些模块在我们的项目部署后是不需要的。

    3.stylus的使用:

     (1). 在.vue文件里面直接使用,只要在style标签加上lang="stylus"即可:

    <style lang="stylus">
       
    </style>

     (2). 引用.styl文件的方式也有两种:

    <script>
        //引入方法一:
        import "@/assets/css/public/common.styl";
    </script>
    
    <style lang="stylus">
         //引入方法二:
       @import "../assets/css/public/common.styl";   //这里使用相对路径
    }

    两者的区别:

    (1)在script标签内引入的styl文件,里面的图片路径是相对于当前的.styl文件的

    (2)在style 标签引入的.styl文件是相对当前的.vue文件的

  • 相关阅读:
    bzoj3473 字符串
    洛谷P4070 生成魔咒
    洛谷P3975 弦论
    AT1219 歴史の研究
    课上讲的几个新的技巧
    索引与视图(转载)
    oracle中的分支与循环语句
    Oracle to_date()函数的用法《转载》
    自定义函数的存储过程的区别
    UNION 和 UNION ALL 操作符
  • 原文地址:https://www.cnblogs.com/yunhemeihe/p/10823690.html
Copyright © 2011-2022 走看看