Sass&Compass安装使用

  1. 安装Ruby环境


    安装后找到此路径
  2. 安装Sass
    <pre>gem install sass</pre>
    若不能直接安装,则使用淘宝镜像:
    <pre>
    $ gem sources --remove https://rubygems.org/
    $ gem sources -a https://ruby.taobao.org/
    $ gem sources -l
    *** CURRENT SOURCES ***
    https://ruby.taobao.org

请确保只有 ruby.taobao.org

$ gem install sass //再次安装Sass
$ sass -v //查看安装版本
</pre>

  1. 安装Compass
    <pre>gem install compass</pre>
    查看安装版本:
    <pre>compass -v</pre>
  2. 创建目录文件

在任意位置使用命令行:
<pre>compass create yourPro</pre>

自动创建sass目录

如图,创建了mySass的文件夹,下面创建了sass文件夹和stylesheets文件夹以及配置文件config.rb。

  1. 实时监听
    在当前目录下:
    <pre>compass watch</pre>
    当scss文件修改时,会自动修改css。
    在对应的css文件中标注了对应scss的位置,所以调试也可以直接通过注释找到scss位置。

到此为止,一个简单的Sass环境就搭建好了啦

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 前言 由于sass是ruby语言开发的,所以安装sass时,必须安装ruby环境 检查是否安装ruby(ruby版...
    Carrie_Gu阅读 6,946评论 0 0
  • 1.背景介绍 CSS 是一门非程序式语言,没有变量、函数、SCOPE(作用域),需要书写大量看似没有逻辑的代码,不...
    远望的云阅读 32,368评论 3 35
  • 从相识到相处,从开始到结束,我们一直是那么的陌生。可能是因为你的高冷,让我只能用各种挑剔来掩盖我对你的喜欢。我们...
    呦呦_yy阅读 1,280评论 0 0
  • 好久没写作业了,今天经历了两件事,一件有了明确的结果,一件有了50%的结果,想把这两件事的发展都问一下,于...
    鱼儿加加阅读 1,235评论 0 0
  • 现在21岁的我,觉得自己懂的很多,可是再怎么了解现实,认知社会,却始终不能也不会迈出独行的这一步。 从出生,到幼儿...
    王大羽羽羽阅读 1,391评论 0 0