如何安装并编译sass为css文件

Python018

如何安装并编译sass为css文件,第1张

1、koala软件编译

2、sass命令:依靠环境。

自动编译命令:(编译单个文件/编译整个文件夹)

编译单个文件

sass文件目录 sass --watch scss文件的路径:css文件的路径 --style expanded

编译整个文件夹

sass文件目录 sass --watch scss文件夹/. : css文件夹/. --style expanded

3、gulp编译

4、hbulid编译

① 工具--预编译设置

② 新建一个预编译配置 .scss

③ 输入触发命令的地址:ruby里面的sass.bat地址

④ 命令参数:%FileName% ../css/%FileBaseName%.css

下载相应的版本。建议大家不要使用谷歌浏览器,因为他真得加载不出来。下载好之后,就需要一步步进行安装了(建议大家把其安装在c盘),这里需要注意的是:这个勾别忘了选,因为不选中,就会出现编译时找不到Ruby环境的情况。这时,我们在控制台输入ruby-v就可以得到我们的安装好的ruby的版本号等信息Ruby安装完成后,在开始菜单中找到新安装的Ruby,并启动Ruby的Command控制面板,如下图所示:当你的电脑中安装好Ruby之后,接下来就可以安装Sass了。同样的在windows下安装Sass有多种方法。给大家提供一种最实用的方法。到Rubygems(http://rubygems.org/)网站上将Sass的安装包(http://rubygems.org/gems/sass)下载下来,然后在命令终端输入:geminstall直接回车即可安装成功。接下来,就是在sublime中安装sass插件和sassbuild插件了,打开我们的sublime首先你要看的是在preference选项下有没有packagecontrol这个选项,如果没有的话,就表示你没有PackageControl插件(一个方便Sublimetext管理插件的插件),这时,你就要从菜单View-ShowConsole或者ctrl+~快捷键,调出console。将以下Python代码粘贴进去并enter执行,不出意外即完成安装sublimetext31importurllib.request,ospf='PackageControl.sublime-package'ipp=sublime.installed_packages_path()urllib.request.install_opener(urllib.request.build_opener(urllib.request.ProxyHandler()))open(os.path.join(ipp,pf),'wb').write(urllib.request.urlopen('http://sublime.wbond.net/'+pf.replace('','%20')).read())sublimetext21importurllib2,ospf='PackageControl.sublime-package'ipp=sublime.installed_packages_path()os.makedirs(ipp)ifnotos.path.exists(ipp)elseNoneurllib2.install_opener(urllib2.build_opener(urllib2.ProxyHandler()))open(os.path.join(ipp,pf),'wb').write(urllib2.urlopen('http://sublime.wbond.net/'+pf.replace('','%20')).read())print('PleaserestartSublimeTexttofinishinstallation')完成了这步之后,再重新打开我们的sublime,ctrl+shift+p,并输入install选择第一个InstallPacage,在命令栏中输入"Sass"然后回车,然后在弹出的列表中选择Sass插件,通过鼠标单击或者回车进行安装,可通过左下角状态栏查看安装结果在命令栏中输入"SassBuild"然后回车,然后在弹出的列表中选择SassBuild插件,通过鼠标单击或者回车进行安装,可通过左下角状态栏查看安装结果按ctrl+shift+p,输入package,选择listpackages,就看到了我们安装的插件列表如果你看到了sass和sassbulid就说明插件安装成功了。这是你把scss文件写完之后,按ctrl+b就可以实现sass文件的编译了,他会生成一个自动编译生成css文件。这里,再跟大家介绍一下windows7下解决中文乱码的问题吧。需要做的就是:找到ruby的安装目录,里面也有sass模块,如这个路径:C:/Ruby/lib/ruby/gems/1.9.1/gems/sass-3.3.14/lib/sass在这个文件里面engine.rb,添加一行代码Encoding.default_external=Encoding.find(‘utf-8’)放在所有的requireXXXX之后即可.