如何编译sass命令行
① 如何安装Sass
ruby安装
因为sass依赖于ruby环境,所以装sass之前先确认装了ruby。先导官网下载个ruby
在安装的时候,请勾选Add Ruby executables to your
PATH这个选项,添加环境变量,不然以后使用编译软件的时候会提示找不到ruby环境
sass安装
如果你喜欢偷懒,或者你公司网络限制比较多,请直接看最后一段
安装完ruby之后,在开始菜单中,找到刚才我们安装的ruby,打开Start Command Prompt with Ruby
然后直接在命令行中输入
gem install sass
按回车键确认,等待一段时间就会提示你sass安装成功。
如果要安装beta版本的,可以在命令行中输入
gem install sass --pre
你还可以从sass的Git repository来安装,git的命令行为
git clone git://github.com/nex3/sass.git cd sass rake install
如果上述的办法你尝试失败了,那说明要么被你的网络墙了这个,要么你的网络信号不好。你可以尝试本地安装,不过有点复杂。这里暴漏个惊天秘密,那就是koala这个编译工具已经内置了sass,所以如果你安装了koala,就根本不需要安装sass,注意ruby还是得安装。关于koala请参阅编译工具。
② sass 用koala怎么编译
我最近也在学sass,之前用的是sublime test2,这个编译器有个好处就是转译成css的时候方便,但是终究还是和项目分离,也很麻烦。后来发现只要通过命令行一直监视整个目录或者文件就方便多了,只要保存,sass就会自动编译,下面是例子:
监视文件:
sass --watch test.scss:test.css
监视目录
sass --watch sass(sass目录):css(css目录)
满意的话希望采纳啦。。。。
③ 怎么使用Less/Sass编译工具koala
一、SASS调试插件的方法
如需调试功能,请在编译输出的时候输出debug信息,那样解析的css文件中就会包含debug信息,然后通过firebug或谷歌的调试工具就可以定位到我们编辑的scss文件,而不是解析后的css文件。
如果光做好SASS的准备工作还不够,还需要让浏览器支持SASS。那么就需要一个浏览器的插件才能让浏览器识别SASS,从而方便开发人员进行开发。
如需调试功能,请在编译输出的时候输出debug信息,那样解析的css文件中就会包含debug信息,然后通过firebug或谷歌的调试工具就可以定位到我们编辑的scss文件,而不是解析后的css文件。(如图1-1)
图1-1
如果你的css文件中没有以@media -sass-debug-info开头的代码,说明没有输出debug信息。请重新使用koala工具编译你的scss文件,并确定已经勾选了debug信息这个选项。
在火狐中调试,只需要再下载FireSass→即可。
二、编译工具koala的安装
1、进入页面
2、根据系统下载所需要的koala的版本
3、然后在下载文件夹中安装下载的EXE文件,即可安装成功
三、编译工具koala的优点
1、多语言支持:支持Less、Sass、CoffeeScript 和 Compass Framework。
2、实时编译:监听文件,当文件改变时自动执行编译,这一切都在后台运行,无需人工操作。
3、编译选项:既可统一设置文件的编译选项,也可单独设置某个文件的编译选项。
4、强大的文件右键功能:右键文件元素,即可操作打开文件,打开文件目录,打开输出文件目录,设置输出文件目录,编译,删除六大常用功能。
5、错误提示:在编译时如果遇到语法的错误,koala将在右下角弹出错误信息,方便开发者定位代码错误位置。
6、跨平台:windows、linux、mac都能完美运行。
7、免费且负责:koala完全免费,而且作者很负责,有什么问题作者都会及时给予答复,意见什么的可以直接提交给作者,一般在下一个版本就能得到解决。
④ 在sass里面怎样引用sass文件
好像不能直接引用.scss(和.sass一样,只是写法规范不同)文件,需要通过工具(软件或命令行)先进行编译生成.css文件后,再引入.css文件使用。
⑤ sass怎么编译同一文件下的不同scss
编译sass文件 在命令行下进入到sass文件所在目录, 运行>compass compile 也可以指定要编译的文件 >compass compile fileName.scss #sass文件夹下会有个config文件指定编译后的css存放位置。
⑥ 安装完sass-loader加载器解析 后怎么将scss文件编译成css
比如我使用webpack,那么我打包的时候,编译器就会帮我编译好了。
LESS同理。
⑦ 编译Sass 文件出现Syntax error: Invalid GBK character报错怎么解决
文件顶部添加 @charset "utf-8";
⑧ 用compass编译sass,进入目录后执行compass watch 后然后书写scss文件却没有进行编译,这是怎么回事呢
您好,这样的:
Sass的安装:
1.安装:SASS是Ruby语言写的,但是两者的语法没有关系。不懂Ruby,照样使用。只是必须先安装Ruby,然后再安装SASS。
假定你已经安装好了Ruby,接着在命令行输入下面的命令:
gem install sass
然后,就可以使用了。
2:使用:
SASS文件就是普通的文本文件,里面可以直接使用CSS语法。文件后缀名是.scss,意思为Sassy CSS。SASS提供两种编译方式,一种是手动编译,一种是监视编译(–watch),手动编译就是当你撰写好CSS时下指令去做编译,监视编译则是你指令一个目录,当此目录里面的*.scss档案有改变时(新增、覆写等等),就会自动去做编译的动作。先来讲手动编译方式:
下面的命令,可以在屏幕上显示.scss文件转化的css代码。(假设文件名为test。)
sass test.scss
如果要将显示结果保存成文件,后面再跟一个.css文件名。
sass test.scss test.css
SASS提供四个编译风格的选项:
* nested:嵌套缩进的css代码,它是默认值。
* expanded:没有缩进的、扩展的css代码。
* compact:简洁格式的css代码。
* compressed:压缩后的css代码。
生产环境当中,一般使用最后一个选项。
sass –style compressed test.sass test.css
还有一种监视的方式做编译,在命令行中切换到当前sass或者scss文件所在的目录,然后运行
sass –watch scss:css
SASS的官方网站,提供了一个在线转换器。你可以在那里,试运行下面的各种例子。
Compass的安装:
1.安装:安装ruby之后,输入命令
gem install compass
2.使用:创建一个 COMPASS 项目
在命令行中切换到你需要创建项目的目录,运行:
compass create "projectname"
这个命令会创建一个包含一系列文件的目录,其中最重要的是配置文件 config.rb,其他文件如果你不需要都可以删除。
在 config.rb 中你可以修改 SASS 和 CSS 的目录及其它一些基础设置。
实时编译 SASS 文件
COMPASS 提供的默认方法是:
在命令行下切换到项目目录,运行
compass watch
COMPASS 将会实时监控 SASS 目录的文件变化,只要你一保存文件,立即将相应文件编译为 CSS 文件。