美文网首页
Mac中配置scss简介和使用(一)--环境配置

Mac中配置scss简介和使用(一)--环境配置

作者: 洲洲哥 | 来源:发表于2016-12-05 14:09 被阅读851次

    简介
    现在有sassscss这些方便前端开发的语言,仔细一看就是比css多了一个s而已。其实就是对css3的一个扩展,增加了规则嵌套、变量、混合、选择、继承等语法。最后通过命令行把他转成标准的css代码。

    配置开发环境

    这些个东西就是用Ruby搞的,如果你是Mac,就不用操心安装Ruby了。如果不是各位看官亲自行查找安装。

    1:查看当前Ruby版本

    Ruby -v
    

    2: 安装sass

    $ gem install sass
    

    如果出现permitted问题通常是权限问题,先尝试下面

    $ sudo gem install sass
    

    如果安装无限等待尝试下面替换RubyGems镜像

    $ gem sources --remove https://rubygems.org/
    //如果你系统不支持https用http
    $ gem sources -a https://ruby.taobao.org/
    $ gem sources -l*** CURRENT SOURCES ***
    https://ruby.taobao.org# 请确保只有 ruby.taobao.org
    $ gem install sass
    

    如果出现下面错误

    ERROR: While executing gem ... (Errno::EPERM)
    Operation not permitted - /usr/bin/sass
    

    尝试下面方法

    $ sudo gem install -n /usr/local/bin sass
    

    安装完成尝试查看sass版本$ sass -v

    到此就安转成功!!!

    3:配置开发环境

    打开WebStom

    点击屏幕左上角 WebStorm-preferences-
    如下图

    D4E19B4A-D8B7-42EB-843C-D0846EB79C4C.png

    点击File Watches 点击“+” 依次添加 Compass Sass 和 Compass Scss .一路点击“OK”就好了。
    配置如下

    6AD46D45-E9B9-4F53-96D8-CCD56AC00F9B.png

    到这里就可以创建scss文件或者sass文件了

    下一篇:《Mac中配置scss简介和使用(二)》--详解使用篇

    如有问题可添加我的QQ:1290925041
    还可添加QQ群:234812704(洲洲哥学院)
    欢迎各位一块学习,提高逼格!
    也可以添加洲洲哥的微信公众号

    更多消息

    更多信iOS开发信息 请以关注洲洲哥 的微信公众号,不定期有干货推送:

    这里写图片描述

    相关文章

      网友评论

          本文标题:Mac中配置scss简介和使用(一)--环境配置

          本文链接:https://www.haomeiwen.com/subject/lqkvpttx.html