本文基本是参照着 用Grunt与livereload构建实时预览的开发环境 实操了一遍,直接实现能实时预览文件列表,内容页面。不用刷新页面了,这比以前开发网页程序都简单。
这里要用到的 Grunt 插件有
grunt-contrib-connect, 用来充当一个静态文件服务器,本身集成了 livereload 功能
grunt-contrib-watch, 监视文件的改变,然后执行指定任务,这里用来刷新grunt serve打开的页面
以下是个辅助的插件
load-grunt-tasks, 省事的插件,有了这个可以不用写一堆的grunt.loadNpmTasks('xxx'),再多的任务只需要写一个require('load-grunt-tasks')(grunt)。
参考的文档中提到了 time-grunt 插件,可用来显示每一个任务所花的时间和百分比,由于此示例中基本就 watch 任务占了百分百的时间。
下面是 Grunt 项目的两个基本的文件 Read More
个人感受,TDD 是一种很好的开发方式,而如今一惯不怎么写测试用例的 JavaScript 代码也有了许多优秀的测试框架,如 Jasmine,Qunit,JsTestDriver,JSUnit,Mocha等。Jasmine(茉莉花--该不会是敏感词吧) 是 BDD,行为驱动开发的测试,典型的例子就是 given-when-then 这样的描述,即基于 Spec 的测试。
Grunt 是 Node.js 生态圈中的构建工具,正火着呢。一说到 Node.js,初接触它的人初印象大概是
require('http').createServer(...).listen(1337, 'localhost'), 这样的例子反而让人无所适从,其实 Node.js 的能耐大着呢。关于 Grunt 的简单使用可以参考之前的一篇:Grunt - 基于 node.js 构建工具之初体验,这篇足够有助于我们对 Grunt 的大局的理解。
Grunt 能与 Jasmine 的结合有赖于 grunt-contrib-jasmine 这条红线,再加上 PhantomJS, 使可以完全脱离浏览器而在控制台下跟测试用例了。 最快速的体验 grunt-contrib-jasmine, 可从 github 上克隆一个例子项目来,当然假设你已安装好 Node.js, Grunt, PhantomJS 这些工具 Read More
自动化构建工具真是缭乱纷呈,最早的 make, nmake, 到 Ant, NAnt, 进化到面向对象的 Maven, Gradle,由 Scala 而起的 SBT, SBuild,再就是今天要说的由 node.js 建立起的生态 Grunt。 Grunt 可以做什么呢,理论上只要有相应的插件支持,它可以应对任何构建任务,但它更为有力的表现是在前端方面。
Grunt 是运行在 node.js 环境,由 npm 来安装,所以首先要安装 node.js, npm, 它们俩的安装不多说,我这里的版本分别是:unmi@localhost ~> node --version
运行 Grunt 还要安装 grunt-cli, 使用命令 npm install -g grunt-cli,安装后我机器上 Grunt 的版本是 Read More
v0.10.24
unmi@localhost ~> npm --version
1.3.21