环境依赖 Nodejs for grunt Ruby for sass 配置文件 package.json { "name": "app", "version": "1.0.0", "devDependencies": { "grunt": "^0.4.5", "grunt-contrib-watch": "^0.6.1", &…

之前曾经安装过一次sass,不过可惜没使用,现在换了电脑重新安装,又上网找了些资料,终于安装成功,现在就当做个记录方便下次安装. 首先 到官网下载个最新版的ruby :http://rubyinstaller.org/downloads 目前最新的稳定版是2.2.2. 下载完成后就是安装了,不过记得选择勾选Add Ruby executables to your PATH这个选项,添加环境变量,不然以后使用编译软件的时候会提示找不到ruby环境. 然后 Ruby如愿的安装成功了.接着就是开始安装…

1.安装Ruby 安装sass 和compass 需要 Ruby 的环境,还区分xp 和win7-8 下版本区别 ruby 官网中文 ruby 官网英文 注意: xp: 下载 [xp不能下载包含64位的版本,我是下载32位安装成功,但调用gem 命令直接报错,不建议使用 包含有64 区分的版本. Ruby 1.9.3-p551 win7-8 : 2.0以上或者跟xp的一样都可以. Ruby 2.1.5 Ruby 2.1.5 (x64) Ruby 2.0.0-p598 Ruby 2.0.0-p59…

css3 width: calc(50% - 10px) sass 1.奇偶行 .classNameA { background:red; &:nth-child(even) { background:green; }}…

想了解Grunt,可以先去官网 看看. 第一次接触Grunt是通过Coding的移动端项目, 刚开始因为环境的问题折腾了一两天,然后就顿悟了. Grunt构建工具对于前端开发而言,简直是神器(ps.虽然我不是专职前端2333)... 高手们 觉得描述有误欢迎指教. 这里只是对我的使用过程做一些简单的记录和描述,说了这么多,我们开始吧. Grunt入门 请先阅读Grunt快速入门! Grunt 作为工具,目的是为了提升开发效率,让繁琐的工作自动化.Grunt 之所以优秀,离不开庞大的插件库.而我们…

1.安装Ruby和SASS 首先我们需要在电脑上安装Ruby和SASS.如果您使用的是Mac,您就没必要安装Ruby.如果您使用的是Window系统,你需要安装Ruby. 2.安装Nodejs 由于使用Grunt需要Nodejs的支持,所以我们要确认自己的电脑已安装了nodejs.安装好以后看看在命令行下能不能执行node命令了,如果可以那么就表示安装成功了. 简单点的安装就是直接进入Nodejs官网中下载各系统所需的安装包进行安装. 3.安装grunt 在安装grunt.js之前,需要先安装G…

开始使用Grunt 大多数开发人员都一致认为,JavaScript开发的速度和节奏在过去的几年里已经相当惊人.不管是Backbone.js和Ember.js的框架还是JS Bin社区,这种语言的发展变化不仅提高我们网站的用户体验,而且我们也在开始使用他们. 当您在使用JavaScript,您可能需要定期执行多个任务.虽然这在大多项目中都存在,但切实是一个耗时的和重复的工作方式.在这样一个活跃的社区,你会假设工具都可以自动化,加快这个过程.此时就出现了Grunt. 什么是Grunt 建立在Node…

原文转自:http://blog.jobbole.com/51586/ 这篇文章将带领你用Grunt来提速和优化网站开发的流程.首先我们会简短介绍Grunt的功能,然后我们直接上手,介绍如何用Grunt的不同插件来替你完成网站项目开发中的很多繁冗工作. 接着我们会创建一个简单的input校验器,用 Sass 来完成CSS的预处理,我们会学习如何用grunt-cssc 和CssMin来合并和压缩CSS,如何用 HTMLHint 来保证我们的HTML正确无误,以及如何实现在运行时部署和压缩我们的文件…

1.环境准备 需要安装Git.Node.Bower.Grunt.Ruby NodeJS https://nodejs.org/en/ Ruby    http://rubyinstaller.org/downloads/archives Git       https://www.git-scm.com/ 2.安装配置检查 下载上面的软件,然后点击连续点击下一步进行安装,安装后看“系统环境变量”Path中是否存在“C:\Ruby23-x64\bin”与“C:\Program Files\Git\…

Grunt Part 1 Objectives and Outcomes In this exercise, you will learn to use Grunt, the task runner. You will install Grunt CLI and install Grunt packages using NPM. Thereafter you will configure a Grunt file with a set of tasks to build and serve yo…