码迷,mamicode.com
首页 > 其他好文 > 详细

SASS环境搭建及HBuilder中sass预编译配置

时间:2017-07-07 21:33:15      阅读:2064      评论:0      收藏:1      [点我收藏+]

标签:dcl   技术分享   相关   cloud   x64   文字   class   source   name   

---------------------------------Ruby安装--------------------------------

 

  1.先下载一个ruby的安装文件:文件名可以搜索:rubyinstaller-2.3.1-x64 

如图:技术分享

  2.建议装到c盘(这里记住你的安装地址,后期有用)

  3.勾选中间的path

技术分享

 

然后就一路"南下”,直到看到

  4.win7系统的在左下角输入start,定位到Start Command Prompt with Ruby面板并调出

技术分享

 

5.命令行里输入:ruby -v  

查看是否安装成功(注意ruby和横线之间有个空格,不然不行。也可直接复制文中文字,然后右击命令行来粘贴,直接cc+cv不行)

技术分享

如图,出现版本号就八九不离十了、、、

 

6.命令行输入: get install sass  来安装sass

技术分享

报了个乱七八糟的错

 

7.(没报错就跳过步骤7,8,9)

命令行输入:gem sources --remove https://rubygems.org/

用来卸载镜像

提示:技术分享

 

8.再安装镜像

命令行输入:gem sources -a http://gems.ruby-china.org/

提示:技术分享

 

9.再次安装sass

命令行里输入:gem install sass

 技术分享

100%完成了

 

------------------------------------------------------HBuilder 中  预编译器配置------------------------------------------------------

1.HBuilder中,“工具”-“预编译器配置”

技术分享

2.新建规则

技术分享

3.填写信息,分别是:

.sass,.scss

D:\Ruby23-x64\bin\sass.bat或C盘路径,看你前期ruby装到哪里

–no-cache %FileName% ../css/%FileBaseName%.css–no-cache %FileName% ../css/%FileBaseName%.css –style compact 

 

技术分享

 

------------------------------------------------------其他教程文链接------------------------------------------------------

HBuilder中配置预编辑器

Sass安装

 其他相关文章

 

2017-07-07  19:27:10

 

技术分享
技术分享

SASS环境搭建及HBuilder中sass预编译配置

标签:dcl   技术分享   相关   cloud   x64   文字   class   source   name   

原文地址:http://www.cnblogs.com/padding1015/p/7133811.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!