grunt是一套前端自动化工具,一个基于nodeJs的命令行工具,一般用于:
① 压缩文件
② 合并文件
③ 简单语法检查
還有有其他用法嗎?
1、nodeJs环境
因为grunt是基于nodeJs的,所以首先各位需要安装nodeJS环境,这块我们便不管了
http://www.cnblogs.com/yexiaochai/p/3527418.html
有了nodeJs环境后,我们便可以开始搞grunt了,因为我们可能在任何目录下运行打包程序,所以我们需要安装CLI
官方推荐在全局安装CLI(grunt的命令行接口)
npm install -g grunt-cli
这条命令将会把grunt命令植入系统路径,这样就能在任意目录运行他,原因是
每次运行grunt时,它都会使用node的require查找本地是否安装grunt,如果找到CLI便加载这个本地grunt库
然后应用我们项目中的GruntFile配置,并执行任务
直接先上实例
首先在D盘新建一个项目如grunt_sample(文件夹就好)
在里面新增两个文件Gruntfile.js 和 package.json(不要问为什么,搞进去先)
依賴包配置都在一個名為package.json文件裏,文件內容舉個例子如下:
{ "name":"grunt-demo", "description": "Example project to demonstrate Grunt.", "version":"0.1.0", "private": true, "author": { "name": "homeemail", "email": "[email protected]" }, "devDependencies": { "grunt": "~0.4.0", "grunt-contrib-sass":"*", "grunt-contrib-uglify": "*", "grunt-contrib-concat": "*", "grunt-css":"*", "grunt-contrib-watch":"*", "grunt-contrib-qunit":"*", "grunt-contrib-jshint":"*" }, "dependencies": { } }
之後在grunt_sample目录下执行 npm install将相关的依賴包文件下载下来
下載後,依賴文件放在名為node_modules的文件夾裏
之後可以放入與項目相關的js,css html文件,
再在Gruntfile.js文件裏進行項目配置
詳細的配置可以參考如下文章
http://www.cnblogs.com/yexiaochai/p/3594561.html