一句话,Grunt是前端的Maven。它是JavaScript世界的构建工具。

1. 首先安装node.js,由于Grunt需要依赖于node.js的npm来管理和安装。最终检测安装node.js成功的标志是:在cmd的DOS命令下输入:

node -v   

npm -v   //安装node.js的时候,系统自动将命令npm加入到了系统变量中,所以在控制台可以输入。

2.  在Dos界面,用命令安装Grunt。 Grunt的一个模块就相当于一个工具,Grunt是由多种工具集合而成的工具箱。

npm install -g grunt -cli  //-g 表示全局安装; grunt是服务器端的版本, grunt-cli是客户端版本。

//Node Package Manager, 即npm

虽然上述命令被执行,但安装grunt -cli并不等于安装了Grunt。(在DOS界面下,Ctrl+C退出当前命令环境)

类似的,安装各个模块的命令:"npm install 模块名称 --save -dev"

npm install <module> --save -dev  //安装各个模块的命令

4. 完成上述两个步骤后,就可以实战Grunt项目。

我们知道在Maven中有pom.xml的配置文件来配置项目信息。同样创建Grunt项目必须有两个文件,package.json文件和Gruntfile.js文件。

//package.json:用于保存项目元数据。
//Gruntfile.js : 用于配置或定义任务、加载 Grunt 插件。

package.json的配置详情如下:    

  {
    "name": "qmcaifu",
    "version": "1.0.1",
    "description": "the web page for html5",
    "main": "index.js",
    "scripts": {
      "test": "echo \"Error: no test specified\" && exit 1"
    },
    "author": "Zhao, Xu-Guang",
    "license": "ISC"
  }

 

完成了package.json和Gruntfile.js两个配置文件后,输入命令:

npm install 

然后在安装Grunt的CLI,Grunt CLI的任务是运行Gruntfile指定的Grunt版本。这样就可以在一台电脑上安装多个Grunt版本。

参考博客:

1. http://www.gruntjs.net/getting-started#cli

你知道什么是Grunt么?的更多相关文章

  1. 初学seaJs模块化开发,利用grunt打包,减少http请求

    原文地址:初学seaJs模块化开发,利用grunt打包,减少http请求 未压缩合并的演示地址:demo2 学习seaJs的模块化开发,适合对seajs基础有所了解的同学看,目录结构 js — —di ...

  2. grunt配置任务

    这个指南解释了如何使用 Gruntfile 来为你的项目配置task.如果你还不知道 Gruntfile 是什么,请先阅读 快速入门 指南并看看这个Gruntfile 实例. Grunt配置 Grun ...

  3. 快速开发Grunt插件----压缩js模板

    前言 Grunt是一款前端构建工具,帮助我们自动化搭建前端工程.它可以实现自动对js.css.html文件的合并.压缩等一些列操作.Grunt有很多插件,每一款插件实现某个功能,你可以通过npm命名去 ...

  4. 是时候搁置Grunt,耍一耍gulp了

    也算是用了半年Grunt,几个月前也写过一篇它的入门文章(点此查看),不得不说它是前端项目的一个得力助手.不过技术工具跟语言一样日新月异,总会有更好用的新的东西把旧的拍死在沙滩上(当然Grunt肯定没 ...

  5. 应用Grunt自动化地优化你的项目前端

    在不久前我曾写了一篇 应用r.js来优化你的前端 的文章,为大家介绍了r.js这个实用工具,它可以很好地压缩.合并前端文件并打包整个项目.但是如果将r.js放到项目中,我们不得不顾及到一个问题——项目 ...

  6. Grunt(页面静态引入的文件地址的改变探究)-V2.0

    相关插件的引用: grunt-usemin  对页面的操作 grunt-contrib-cssmin  压缩css load-grunt-tasks 瘦身gruntfile grunt-rev给md5 ...

  7. Grunt基本使用-V1.0

    浅语:grunt中文网:http://www.gruntjs.net/ 第一步:Grunt 依赖 Node.js 所以在安装之前确保你安装了 Node.js.然后开始安装 Grunt. 实际上,安装的 ...

  8. nodejs、npm、grunt——名词解释

    最近着手开发一个新项目,打算从工程化的角度整理一套自己的前端开发.发布体系. grunt这些工具,之前别人用我也用,并没有认真想过它们的前世今生,正好趁着这个机会,我来理一理目前业界比较流行这些工具的 ...

  9. grunt自定义任务——合并压缩css和js

    npm文档:www.npmjs.com grunt基础教程:http://www.gruntjs.net/docs/getting-started/ http://www.w3cplus.com/to ...

  10. Grunt学习使用

    原文地址:Grunt学习使用必看 grunt简介神马的不多说,到处一大堆. 我只说说我已经实现了的代码. 按照官方的教程 相信已经配置好了,接下来说 package.json 和 Gruntfile. ...

随机推荐

  1. fir.im Weekly - 2016 年 Android 最佳实践列表

    2016 年已经过去一半,你在年初制定的成长计划都实现了吗? 学海无涯,技术成长不是一簇而就的事情.本期 fir.im Weekly 推荐 王下邀月熊_Chevalier的 我的编程之路--知识管理与 ...

  2. web 安全

    一.客户端脚本安全 (1)跨站脚本攻击(XSS): XSS攻击,通常指黑客通过“html注入” 篡改了网页,插入了恶意的脚本,从而在用户浏览网页的时候,控制用户浏览器的一种攻击. 最常见的XSS攻击就 ...

  3. maven install 读取jar包时出错;error in opening zip file

    错误信息: [INFO] ------------------------------------------------------------------------ [ERROR] Failed ...

  4. AJAX文件上传实践与分析,带HTML5文件上传API。

    对于HTML5已经支持AJAX文件上传了,但如果需要兼容的话还是得用一点小技巧的,HTML5等等介绍,先来看看以前我们是怎么写的. 网上可能会有一些叫AJAX文件上传插件,但在AJAX2.0之前是不可 ...

  5. 使用SQL Server Audit记录数据库变更

        最近工作中有一个需求,就是某一个比较重要的业务表经常被莫名其妙的变更.在SQL Server中这类工作如果不事前捕获记录的话,无法做到.对于捕获变更来说,可以考虑的选择包括Trace,CDC. ...

  6. 强制SQL Server执行计划使用并行提升在复杂查询语句下的性能

        最近在给一个客户做调优的时候发现一个很有意思的现象,对于一个复杂查询(涉及12个表)建立必要的索引后,语句使用的IO急剧下降,但执行时间不降反升,由原来的8秒升到20秒.     通过观察执行 ...

  7. Ubuntu-安装-theano+caffe-超详细教程

    一.说明 本文是继<Ubuntu-安装-cuda7.0-单显卡-超详细教程> 之后的续篇.theano和caffe是深度学习库,对运算能力需求很大,最好使用cuda进行加速.所以,请先阅读 ...

  8. DOM动态脚本和动态样式

    动态脚本 [定义] 在页面加载时不存在,但将来的某一时刻通过修改DOM动态添加的脚本. [方式] [1]插入外部文件方式 var script = document.createElement(&qu ...

  9. Azure China (7) 使用WebMetrix将Web Site发布至Azure China

    <Windows Azure Platform 系列文章目录> 本章介绍的是,使用世纪互联运维的Azure云服务. 1.首先我们登陆Azure管理界面.http://manage.wind ...

  10. JVM Tomcat性能实战

    本节只是介绍实战部分,具体的理论参数,请自行百度. 所需工具:linux服务器  Jmeter测试工具  xshell   一个web应用 Tomcat的JVM参数可以配置在catalina.sh,如 ...