你知道什么是Grunt么?
一句话,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么?的更多相关文章
- 初学seaJs模块化开发,利用grunt打包,减少http请求
原文地址:初学seaJs模块化开发,利用grunt打包,减少http请求 未压缩合并的演示地址:demo2 学习seaJs的模块化开发,适合对seajs基础有所了解的同学看,目录结构 js — —di ...
- grunt配置任务
这个指南解释了如何使用 Gruntfile 来为你的项目配置task.如果你还不知道 Gruntfile 是什么,请先阅读 快速入门 指南并看看这个Gruntfile 实例. Grunt配置 Grun ...
- 快速开发Grunt插件----压缩js模板
前言 Grunt是一款前端构建工具,帮助我们自动化搭建前端工程.它可以实现自动对js.css.html文件的合并.压缩等一些列操作.Grunt有很多插件,每一款插件实现某个功能,你可以通过npm命名去 ...
- 是时候搁置Grunt,耍一耍gulp了
也算是用了半年Grunt,几个月前也写过一篇它的入门文章(点此查看),不得不说它是前端项目的一个得力助手.不过技术工具跟语言一样日新月异,总会有更好用的新的东西把旧的拍死在沙滩上(当然Grunt肯定没 ...
- 应用Grunt自动化地优化你的项目前端
在不久前我曾写了一篇 应用r.js来优化你的前端 的文章,为大家介绍了r.js这个实用工具,它可以很好地压缩.合并前端文件并打包整个项目.但是如果将r.js放到项目中,我们不得不顾及到一个问题——项目 ...
- Grunt(页面静态引入的文件地址的改变探究)-V2.0
相关插件的引用: grunt-usemin 对页面的操作 grunt-contrib-cssmin 压缩css load-grunt-tasks 瘦身gruntfile grunt-rev给md5 ...
- Grunt基本使用-V1.0
浅语:grunt中文网:http://www.gruntjs.net/ 第一步:Grunt 依赖 Node.js 所以在安装之前确保你安装了 Node.js.然后开始安装 Grunt. 实际上,安装的 ...
- nodejs、npm、grunt——名词解释
最近着手开发一个新项目,打算从工程化的角度整理一套自己的前端开发.发布体系. grunt这些工具,之前别人用我也用,并没有认真想过它们的前世今生,正好趁着这个机会,我来理一理目前业界比较流行这些工具的 ...
- grunt自定义任务——合并压缩css和js
npm文档:www.npmjs.com grunt基础教程:http://www.gruntjs.net/docs/getting-started/ http://www.w3cplus.com/to ...
- Grunt学习使用
原文地址:Grunt学习使用必看 grunt简介神马的不多说,到处一大堆. 我只说说我已经实现了的代码. 按照官方的教程 相信已经配置好了,接下来说 package.json 和 Gruntfile. ...
随机推荐
- Js~对数组进行分组户数
在sql里有group by,主要对数据结果集进行分组统计,而对于JS来说,有时我们也需要这种功能,例如一个数据{"dog","cat","dog&q ...
- struts2学习笔记之十一:struts2的类型转换器
Struts2的类型转换器 如何实现Struts2的类型转换器? * 继承StrutsTypeConverter * 覆盖convertFromString和convertToString 注 ...
- [数据库连接池] Java数据库连接池--DBCP浅析.
前言对于数据库连接池, 想必大家都已经不再陌生, 这里仅仅设计Java中的两个常用数据库连接池: DBCP和C3P0(后续会更新). 一. 为何要使用数据库连接池假设网站一天有很大的访问量,数据库服务 ...
- paip. 提升性能---hibernate的缓存使用 总结
paip. 提升性能---hibernate的缓存使用 总结 作者Attilax 艾龙, EMAIL:1466519819@qq.com 来源:attilax的专栏 地址:http://blog ...
- Java 线程 — ConcurrentHashMap
ConcurrentHashMap ConcurrentHashMap 结构 采用了分段锁的方法提高COncurrentHashMap并发,一个map里面有一个Segment数组--即多个Segmen ...
- 开发工程师面试的秘密( 整理自 Export C Programming )
开发工程师面试的秘密 因为打算转战linux平台,所以一直在配置自己喜欢的linux操作系统.同时在看那本<C 专家编程>,这本书主要是针对ANSI C 介绍的,所以和Linux(Unix ...
- ASP.NET MVC在线人数统计
在Global.asax.cs文件中代码: protected void Application_Start() { Application[; AreaRegistration.RegisterAl ...
- Android线程机制——AsyncTask
对于Android为什么要使用多线程,因为从Android4.0之后,谷歌规定了网络操作不允许放在主线程中执行,由此就有了多线程的机制,有个JAVA学习经验的朋友一定知道多线程指的是什么,简单来讲就是 ...
- 信息加密之Base64
Base64是一种最简单的简单的加密形式,经常被使用,记录一下,以便日后可以深入了解. jdk格式: //获得密钥Base64Encoder encoder = new Base64Encoder() ...
- NodeJS实战:Express+Mongoose+ejs
元宵还没到,先向所有朋友拜一个晚年~~~ 文章目录: 1.组件版本号 -- --node -- --express -- --Mongoose 2.初始化项目 firstblood -- --用 ex ...