sass ruby环境 安装配置,使用sublime text3 中sass

   2023-02-08 学习力0
核心提示: 首先,你想要使用sass的话,就必须依赖于ruby环境。所以,你要下一个ruby。具体的链接应该是(http://rubyinstaller.org/downloads)。下载相应的版本。- 下载好之后,就需要一步步进行安装了(建议大家把其安装在c盘),这里需要注意的是:这个勾别忘了选,

 

首先,你想要使用sass的话,就必须依赖于ruby环境。所以,你要下一个ruby。具体的链接应该是(http://rubyinstaller.org/downloads)。下载相应的版本。-

sass ruby环境 安装配置,使用sublime text3 中sass

 

下载好之后,就需要一步步进行安装了(建议大家把其安装在c盘),这里需要注意的是:

sass ruby环境 安装配置,使用sublime text3 中sass

这个勾别忘了选,因为不选中,就会出现编译时找不到Ruby环境的情况。

 

  1. 现在我们开始安装sass,在“开始”菜单中打开ruby的控制面板。

    sass ruby环境 安装配置,使用sublime text3 中sass
  2.  

    输入gem install sass ,按回车键执行命令。如果提示安装成功,这个步骤后面的内容可忽略。但大多数情况下,由于国内网络原因,导致 rubygems.org 存放在 Amazon S3 上面的资源文件间歇性连接失败。这时候我们可以通过gem sources命令来配置源,先移除默认的https://rubygems.org源,然后添加淘宝的源https://ruby.taobao.org/,然后查看下当前使用的源是哪个,如果是淘宝的,则表示可以输入sass安装命令gem install sass了。具体操作如下:

  3.  

    先移除默认的https://rubygems.org源,命令为gem sources --remove https://rubygems.org/,按回车,结果如下:

    sass ruby环境 安装配置,使用sublime text3 中sass
  4.  

    添加淘宝的源,命令为gem sources -a https://ruby.taobao.org/,按回车,结果如下:

    sass ruby环境 安装配置,使用sublime text3 中sass
  5.  

    查看当前使用的源,命令为gem sources -1,按回车,结果如下:

    sass ruby环境 安装配置,使用sublime text3 中sass
  6.  

    执行gem install sass 命令,安装sass, 结果如下:

    sass ruby环境 安装配置,使用sublime text3 中sass
  7.  

    执行sass -v命令,就可以看到你安装的sass版本了,结果如下:

    sass ruby环境 安装配置,使用sublime text3 中sass
  8.  

    到这里,sass就已经安装好了。后话:

    更新sass的命令语句为:gem update;

    如果想要安装sass的某一特定版本,命令语句为: gem install sass --version=3.3.0;

    如果想要删除sass的某一特定版本,命令语句为: gem uninstall sass --version=3.3.0;

    查看ruby 安装的所有程序包,命令语句为: gem list;

 

 

Ruby 安装完成

 

在桌面新建SassApp文件夹,在当前目录打开cmd,利用命令 compass create  ***,新建一个工程

sass ruby环境 安装配置,使用sublime text3 中sass

sass ruby环境 安装配置,使用sublime text3 中sass

 

成功后,在hello文件夹下,产生如下目录

 sass ruby环境 安装配置,使用sublime text3 中sass

 

 然后在sass  目录新建一个  demo1.scss 用sublime text编辑scss,

    输入编译命令如下,如果每次修改demo1.scss,都要重新编译很麻烦,所以提供自动了监视编译的命了  (sublime text中**.scss,保存即可自动编译)

sass ruby环境 安装配置,使用sublime text3 中sass

 

sass ruby环境 安装配置,使用sublime text3 中sass

 

也可以监视整个文件加,终止操作,向上退出一级文件夹,这时候要在项目hello文件夹下操作

 

sass ruby环境 安装配置,使用sublime text3 中sass

 

也可以自动监视,编译文件夹

sass ruby环境 安装配置,使用sublime text3 中sass

 

解决只是问题

    demo1.scss  // 注释    在生成的demo1.css 中不显示    。

           /* 注释 */在生成的demo1.css 中显示    。

           /*! 注释 */重要注释,压缩编译模式也会在demo1.css 中显示

           /*中文注释*/ 要进行配置,如下

没有配置编译中文产生错误如图;

sass ruby环境 安装配置,使用sublime text3 中sass

配置中文注释

  (我的路径 )

      E:\Ruby22-x64\lib\ruby\gems\2.2.0\gems\sass-3.4.23\lib\sass\

      在这个文件里面engine.rb ,添加如下代码

  #中文注释

      Encoding.default_external=Encoding.find('UTF-8')

 

sass ruby环境 安装配置,使用sublime text3 中sass

sass ruby环境 安装配置,使用sublime text3 中sass

 

 

再次编译 输入  compass watch --force   结果

sass ruby环境 安装配置,使用sublime text3 中sass

 

 

 

 

 

 

接下来,就是在sublime中安装sass插件和sass build插件了,打开我们的sublime

Package Control 插件 ctrl+shift+p    输入install

sass ruby环境 安装配置,使用sublime text3 中sass

选择第一个Install Pacage,

  在命令栏中输入"Sass"然后回车,然后在弹出的列表中选择Sass插件,

sass ruby环境 安装配置,使用sublime text3 中sass

 

按ctrl+shift+p,选择list packages 插件列表, 输入sass,就看到了我们安装的

sass ruby环境 安装配置,使用sublime text3 中sass

如果你看到了sass和sass bulid就说明插件安装成功了。

 

 

【作者】:轻轻走143
【出处】:http://www.cnblogs.com/qingqingzou-143/
【声明】:所有博文标题后加(share)的表示收集的他人优秀文章,其余的则为原创。欢迎转载,但请在显要位置显示本文链接,并保留本段声明,否则追究法律责任,谢谢!

 
反对 0举报 0 评论 0
 

免责声明:本文仅代表作者个人观点,与乐学笔记(本网)无关。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
    本网站有部分内容均转载自其它媒体,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责,若因作品内容、知识产权、版权和其他问题,请及时提供相关证明等材料并与我们留言联系,本网站将在规定时间内给予删除等相关处理.

  • [ruby on rails] 跟我学之(6)显示指定数据
    根据《[ruby on rails] 跟我学之路由映射》,我们知道,可以访问 GET    /posts/:id(.:format) 来显示具体的对象。 修改 app/controllers/posts_controller.rb的show这个action。这里有个难题,如果获取url里面的参数?可以通过params内置变量进行访问
    03-16
  • [ruby on rails] 跟我学之(10)数据输入验证
    这里简单加上几个验证,非空,最小长度,唯一修改app/models/post.rb文件,如下:class PostActiveRecord::Base#attr_accessible :title, :contentvalidates :title, :context, :presence = truevalidates :title, :length = { :minimum =2}validates :title,
    03-16
  • 我尝试使用 Ruby 和 mittsu 库制作 3D 战斗动作游戏
    我尝试使用 Ruby 和 mittsu 库制作 3D 战斗动作
    概述这篇文章是关于我偶然发现的 hitbox 的回忆录。2022 夏季鲁比训练营创造了这个游戏。我的游戏仓库这里是。我们作为一个团队开发,有 4 名成员第一次见面,并第一次使用 Git 和 Github 进行开发。使用的技术是Ruby,三通图书馆是。我主要负责碰撞检测,所
    03-16
  • 我只是想在我的 Mac 上将 Ruby 和 Rails 更新到终端中的最新版本。 .
    我只是想在我的 Mac 上将 Ruby 和 Rails 更新到
    介绍自从我尝试创建一个简单的应用程序以来已经有很长时间了,并且我尝试在创建它之前将 Ruby 和 Rails 更新到最新版本,但是我意外卡住了,所以我将它作为备忘录留下。作为版本升级1. 更新 Homebrew 和 rbenv2. 红宝石更新3. Rails 更新这就是它的感觉。让我
    03-16
  • ruby写爬虫 ruby python
    ruby写爬虫 ruby python
    http://www.javaeye.com/topic/545160爬虫性能比较http://www.rubyrailways.com/data-extraction-for-web-20-screen-scraping-in-rubyrails/srcapihttp://huacnlee.com/blog/ruby-scrapi-collect-koubei  2009年4月22日 星期三用ruby写的一个网络爬虫程序前
    03-08
  • 一个关于创建一个可以用 Ruby 做 UMAP 的 gem 的故事
    一个关于创建一个可以用 Ruby 做 UMAP 的 gem
    介绍统一流形逼近和投影 (UMAP) 是一种通过降维的可视化方法,通常与 t-SNE 一起使用。用 Ruby 语言执行机器学习时,瘤胃我认为有很多情况下你使用 gem 调用。瘤胃有t-SNE但不是UMAP。这一次,它是一个 C++ 库乌马普的红宝石绑定我创造了它,所以我会在我忘记
    03-08
  • 让我们制作一个应用程序,当您在表格①中输入名称时输出 PDF 戳记(使用 Ruby on Rails 创建 PDF 文件)
    让我们制作一个应用程序,当您在表格①中输入名
    介绍你好!我的名字是荣查本。这次在Ruby on Rails中实现PDF转换的时候,用到了一个叫Prawn的gem,所以总结了一下。您可以通过阅读本文创建フォームに名前を入力するとPDF化された印鑑を出力するアプリ。即使是我,一个初学者也可以做到,所以实现方法很简单
    03-08
  • [脚本_Ruby]Windows安装配置Ruby On Rails
    感觉Java学的差不多了,想接触下Ruby On Rails,看看它比Java WEB高效到哪里了,在Ubuntu12.10上弄了两天总是报错提示没有指向的文件sqlite3,不管怎么安装sqlite3都不行,到最后没办法只有跑到WIN7平台下试试,以下就是我搭建Ruby On Rails的过程:    
    02-10
  • Prawn:Ruby生成PDF更简捷的选择
    在InfoQ上看到《Prawn:使用Ruby生成PDF更简捷》,其说到的Prawn可以更加快捷的在Ruby中生成PDF文件。因为之前使用过很多版本的PDF生成类库都不尽如人意,有的太复杂,有的太慢,于是对这个做了测试。1、安装安装很简单,直接使用gem install prawn即可安装完
    02-10
  • Ruby On Rails:InstanRails
    参考数据:对于Ruby On Rails 不是粉清楚的朋友可以参考以下的连结信息,该连结网站都提供不错的Ruby On Rails 信息。Ruby: 一个纯OO的脚本语言..Ruby on Rails: 快速建置Web的MVC架构的Framework说明:整合环境: Instant Rails 是在Windows环境中,整合了Ruby,
    02-10
点击排行