1、初始化项目

  compass create test(项目名称),会在当前目录下创建test子目录,test的子目录下有config.gb文件,sass和stylesheets文件夹。

2、编写sass代码

3、编译sass

  编译的几种命令:

    compass compile:将sass子目录中的scss文件,编译成css文件,保存在stylesheets子目录中。

    compass compile --output-style compressed:压缩文件并删除注释

    compass compile --force:只编译发生变动的文件

    compass watch:自动编译

  在config.gb下配置编译命令:output_style = :expanded/:nested/:compact()/:compressed

使用compass编译sass的更多相关文章

  1. nodejs编译sass模块包 node-compass,与gulp包gulp-sass使用方法

    简介:node express或者就是node项目中,要自动编译sass方法很多,比如gulp 比如考拉,比如今天我想说的这个包node-compass. 编译sass的三种方法: 前提条件: 都需要 ...

  2. sass的入门(安装以及sublime中如何编译sass)

    很久之前就听到了sass和less,但是因为人懒(默默吐槽下自己),就没有去了解相关的知识.但是身为一个前端人员不了解sass好像有点low low 的,所以现在开始接触使用sass了. 万事开头难, ...

  3. grunt-contrib-compass 编译sass

    grunt-contrib-compass的作用是编译sass文件为css.使用该插件需要先安装sass和compass. (1)安装sassgem install sass(2)安装compassg ...

  4. Sublime Text通过插件编译Sass为CSS及中文编译异常解决

    虽然PostCSS才是未来,但是Sass成熟稳定,拥有一大波忠实的使用者,及开源项目,且最近Bootstrap 4 alpha也从Less转到Sass了.所以了解Sass还是非常有必要的. 基于快速开 ...

  5. Gulp如何编译sass

    Gulp 是一个自动化工具,前端开发者可以使用它来处理常见任务: 1.搭建web服务器 2.文件保存时自动重载浏览器 3.使用预处理器如Sass.LESS 4.优化资源,比如压缩CSS.JavaScr ...

  6. webpack+vue-loader 在单独.vue组件中使用sass-loader编译sass报错问题not a valid Win32 applictation

        如果webpack配置没有问题,在vue文件中编译sass/scss报上面的错误,大概是由于node-sass安装失败,重新卸载安装,   在国内安装node-sass失败的话,可以使用淘宝镜 ...

  7. 续Gulp使用入门编译Sass

    使用 gulp 编译 Sass Sass 是一种 CSS 的开发工具,提供了许多便利的写法,大大节省了开发者的时间,使得 CSS 的开发,变得简单和可维护. 安装 npm install gulp-s ...

  8. ruby中输入命令行编译sass(ruby小白)

    Ruby(或cmd中)输入命令行编译sass步骤如下: (1)举例而言:首先在F盘下建立一个总文件夹,比如test文件夹:其次在该文件夹下建立html,images,js,sass等文件夹. (2)在 ...

  9. 编译SASS

    编译SASS sass编译有很多种方式,如命令行编译模式.sublime插件SASS-Build.编译软件koala.前端自动化软件codekit.Grunt打造前端自动化工作流grunt-sass. ...

随机推荐

  1. Mac、Linux更换命令行svn diff为P4Merge、vimdiff

    2015-01-21 21:25:52 这里先把那个程序员大神的博客地址贴一下(PS:大神,我不是为了抄袭哦,真是怕自己忘记了),http://www.ccvita.com/445.html,里面还有 ...

  2. SQLite数据库使用

    最近在查看一些关于数据库的相关文档博客写写总结,以防下次自己又忘啦  哈哈 首先,安卓是有给我们提供一个帮助类SQLiteOpenHelper,这个类我们一般需要实现3个方法,哈哈这个编译工具是会提示 ...

  3. Redis和Memcache的区别

    Redis和Memcache的区别 总结一: 1.数据类型 redis数据类型丰富,支持set liset等类型 memcache支持简单数据类型,需要客户端自己处理复杂对象 2.持久性 redis支 ...

  4. Flex 利用Space控制进行组件的右对齐

    Spacer 控件可帮助您布置父容器中的子项.虽然 Spacer 控件不会绘制任何内容,但它会在父容器中为其本身分配空间. 在以下示例中,使用灵活的 Spacer 控件将 Button 控件推到右侧, ...

  5. 输入输出流(IO)

    输入输出流(IO)文件(File)java.io.File用于表示文件(目录),也就是说程序员可以通过File类在程序中操作硬盘上的文件和目录.File类只用于表示文件(目录)的信息(名称.大小等), ...

  6. 只需三步 快速完善网站Sitemap

    越来越多的SEOer把优化的重点放在了站内优化上,细心的朋友应该查看一些前辈的robots.txt的时候不难发现,他们的robots中都加 入了一句Sitemap: http://www.dewang ...

  7. UNITY更新到5后设置的动画无法播放了怎么办

    点击对应的animator,将 apply root motion  这个选项的勾去掉就可以了,纠结了很久最后在UNITY官方论坛找到的答案

  8. jdb调试命令

    常用调试命令: run GeoHashTest #带参数运行 stop at GeoHashTest:22 #断点GeoHashTest文件的22行 stop in GeoHashEncode.Enc ...

  9. hdu1260 dp

    题意:有 k 个人需要买电影票,a[i] 表示第 i 个人单独买票要花费的时间,b[i] 表示第 i-1 个和第 i 个人一起买票需要花费的时间,问卖给所有人各一张票最少需要到什么时候. dp[i]表 ...

  10. LeetCode 【31. Next Permutation】

    Implement next permutation, which rearranges numbers into the lexicographically next greater permuta ...