码迷,mamicode.com
首页 > 其他好文 > 详细

grunt自动化构建工具

时间:2016-09-09 22:23:22      阅读:163      评论:0      收藏:0      [点我收藏+]

标签:

一、什么是grunt?

  是基于nodejs的项目构建工具,grunt和grunt插件是通过npm安装并管理的,npm是node.js的包管理器

二、为什么要用grunt?

  自动化。对于反复重复的任务,例如压缩、编译、单元测试等,自动化工具可以减轻你的劳动,简化你的工作

三、如何使用?

  1、首先安装nodejs,安装包及源码下载地址:https://nodejs.org/en/download/。

  2、安装grunt,需要先将grunt命令行(CLI)安装到全局环境中,

    npm install -g grunt-cli

    上述命令执行完后,grunt 命令就被加入到你的系统路径中了,以后就可以在任何目录下执行此命令了。

  3、一般在项目中需要添加两份文件:package.json 和 Gruntfile.js

  package.json 如下:

{
"name": "gruntTest",
"version": "1.0.0",
"devDependencies": {
"grunt": "^1.0.1",
"grunt-contrib-jshint": "^1.0.0", //检查js语法
"grunt-contrib-uglify": "^2.0.0",  //js压缩
"grunt-contrib-watch": "^1.0.0"   //监听js文件变动
}
}  
  Gruntfile.js 如下:
module.exports = function(grunt){
grunt.initConfig({
pkg:grunt.file.readJSON(‘package.json‘),
uglify:{
bulid:{
expand: true, //启用动态扩张
src:‘DemoTmp/js/*.js‘, //需要压缩的js文件所在路径
//dest:‘DemoTmp/js/‘, //压缩后文件所在路径
ext:‘.min.js‘,      //压缩后的文件名
extDot:‘first‘      //扩展文件名开始后第一个点
}
}
});
grunt.loadNpmTasks(‘grunt-contrib-uglify‘); //加载任务插件
grunt.registerTask(‘default‘,[‘uglify‘]);    //默认被执行的任务列表
};
4、以上两个文件配置好后,就可以进行操作了:
  1)将命令行的当前目录转到项目根目录下
  2)执行 npm install 命令安装项目依赖的库
  3)执行 grunt 命令

 

 

    

 

grunt自动化构建工具

标签:

原文地址:http://www.cnblogs.com/donglf/p/5858136.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!