最新Win7 64位系统下Ruby 配置 haml、sass、scss环境

【导读】工作需要,折腾了几小时,终于在Win 7 64位系统下成功配置搭建了ruby、haml、sass、scss的环境,在这里分享一下。

1、安装Ruby

没有安装Ruby环境的同学需要安装一下Ruby,附官网下载链接:

http://rubyinstaller.org/downloads/

1)根据系统环境选择合适的Ruby版本下载,64位系统选择Ruby 2.1.5(x64)下载;

2)运行rubyinstaller-2.1.5-x64.exe,安装完成后,在开始菜单找到并打开Start Command Prompt With Ruby,

输入:

ruby -v

3)如果能显示ruby版本号则表示安装成功。


2、安装sass

1)在打开的Start Command Prompt With Ruby窗口中输入:

gem install sass

2)如果提示安装不成功,多尝试几次(gem安装会从不同的CDN服务器上提取文件,有些提取不到,多次尝试可以找到合适的CDN服务器地址)。提示安装成功后,可以输入:

sass -v

3)显示正确的版本号则表示安装成功。


3、安装haml

1)在打开的Start Command Prompt With Ruby窗口中输入:

gem install haml

2)同上,如果提示安装不成功,多尝试几次。通过输入:

haml -v

3)显示正确的版本号表示安装成功。


4、sass or scss 解释/转化 为 css

1)创建一个index.scss文件(或者sass文件),语法存在差异,具体可以参考sass 官方文档

$font-stack:    Helvetica, sans-serif;
$primary-color: #333;
body {
  font: 100% $font-stack;
  color: $primary-color;
}

2)在打开的Start Command Prompt With Ruby窗口中找到这个文件所在的目录,输入下面的命令实现转化:

sass index.scss indec.css

3)如果转换成功,则表示当前的sass环境已经生效


5、haml 解释/转化 为html

1)创建一个index.haml文件,具体标准参考Haml 官方文档

%ul 
    %li Salt 
    %li Pepper

2)在打开的Start Command Prompt With Ruby窗口中找到这个文件所在的目录,输入下面的命令实现转化:

haml index.haml index.html

3)如果转换成功,则表示当前的sass环境已经生效


6、以上环境应该可以满足基本的haml、scss开发了,如果还需要html2haml,则需要继续安装devkit,

下载地址:http://rubyinstaller.org/downloads/

1)根据系统环境下载安装devkit,在打开的Start Command Prompt With Ruby窗口中找到devkit安装的目录,输入:

ruby dk.rb init

2)会提示产生了一个config.yml配置文件,需要打开文件配置一下ruby的安装目录;

# Example:
#
# ---
# - C:/ruby19trunk
# - C:/ruby192dev
#
---
- C:/Ruby21-x64

3)再次输入:

ruby dk.rb install

4)安装成功会提示:

[INFO] Updating convenience notice gem override for 'C:/Ruby21-x64'
[INFO] Installing 'C:/Ruby21-x64/lib/ruby/site_ruby/devkit.rb'

5)安装Hpricot,运行 html2haml 命令需要首先安装 Hpricot

gem install hpricot

6)运行html2haml命令

html2haml index.html index.haml


参考文章:

Ruby 环境配置及HAML 及SASS 应用

Ruby解决方案:The 'ffi' native gem requires installed build tools ; 含最新DevKit下载地址


学习资料:

Ruby官网下载

Sass/Scss官网

Haml官网


 赞(0
成功
相关阅读: