没有闲话和grunt.initConfig()
grunt.initConfig()为Gruntfile.js的核心部分,它接收对象作为参数。
对象包含两种类型的属性,一种是单纯的变量,一种是task类型。举个栗子:
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'), //单纯的变量,像我一样单纯
concat: {} //task类型
});
PS:所有单纯的变量可以'prefix<%=var%>suffix'的形式读取
task类型也包含两种类型的属性,一种是options,一种是具体的task(标准说法为target)
target同样包含两种类型的属性,一种是options,覆盖task类型的options,一种是files
以下例子使用grunt-contrib-concat,用于文件的合并
concat : {
options : {
separator : ';', //被覆盖
banner : '/*<%= grunt.template.today("yyyy-mm-dd") %>*/'
},
test : {
options : {
separator : '<%= grunt.util.linefeed %>'
},
files : [{
dest : 'dest/hello.js',
src : ['src/*.js']
}
]
}
}
结构如下图
files部分是所有插件通用的,但options视task不同而不同,以下介绍files
files有三种写法,例子中最标准且复杂的一种
//第一种,满足所有要求
files : [{
dest : 'dest/hello.js',
src : ['src/*.js']
}
]
//第二种,无法设置其他参数
files : {
'dest/hello.js' : ['src/*.js']
}
//第三种,只能设置单个任务
dest : 'dest/hello.js',
src : ['src/*.js']
另外files中的path支持5种通配符
- *匹配separator之外的所有字符0-N
- ?匹配separator之外的所有字符1
- **匹配所有字符0-N
- {}匹配其中逗号分隔的表达式
- !反集合
最后是files的各个属性,分为两个部分,基础(src、dest、filter、nonull、dot、matchBase、expand)和扩展(cwd、ext、flatten、rename)
src: string or array 源文件
dest: string 目标文件
filter: function 传入src中各文件的filepath,筛选出返回true的作为源文件
string fs.Stats(node中的检测文件类型的类)的方法名
- isFile 普通文件
- isDirectory 文件夹
- isBlockDevice 块设备文件(POSIX概念,比如移动硬盘对应的文件)
- isCharacterDevice 字符设备文件(POSIX概念,比如键盘鼠标对应的文件)
- isSymbolicLink 软链接文件(POSIX概念,理解成windows下的快捷方式吧)
- isFIFO (POSIX概念,管道文件,用于进程间通信)
- isSocket (POSIX概念,套接字文件,用于端口通信)
nonull: 嗯,不太懂
dot: boolean 以.开头的文件(linux中的隐藏文件)亦作为源文件,默认为false
matchBase: 可能存在理解的偏差
我的case使用了下面的expand,目录结构为src下123/acb,acb/123,使用如下配置
files: [{
expand: true,
cwd: 'src/',
src: ['a?b'],
dest: 'dist/'
}]
目标文件夹下将出现acb文件夹,但不包含任何文件,而添加matchBase后
files: [{
expand: true,
cwd: 'src/',
src: ['a?b'],
dest: 'dist/',
matchBase: true
}]
目标文件夹下将出现acb文件夹和123文件夹,acb文件夹为空,123文件夹下包含acb文件
expand: boolean 启用扩展属性,默认为false
dest(expand): string 目标文件夹
cwd: string src的相对路径
ext: string 生成文件的后缀名
expand: true,
cwd: 'src/',
src: ['*.js'],
dest: 'dest/',
ext: '.min.js'
flatten: boolean 为true则生成的文件统一放在dest文件夹中,无子文件夹,默认为false
expand: true,
cwd: 'src/',
src: ['*.js', '**/*.js'],
dest: 'dest/',
ext: '.min.js',
flatten: true
rename: function 传入[dest, filepath, files],默认为return dest + filepath;
以上是initConfig的基本配置,还有瑕疵,下一篇开始从各个插件着手具体的应用。
没有闲话和grunt.initConfig()的更多相关文章
- 闲话和grunt
一年半没更新是因为自己转岗了,android framework+system转前端,可以想象过程之苦逼,苦成了一首诗:很烦很烦/非常烦/非常非常十分烦/特别烦特烦/极其烦/贼烦/简直烦死了/啊——. ...
- AngularJS——grunt神器的安装
前言: 刚开始学 angularJS,在慕课网上看的大漠老师的视频(http://www.imooc.com/learn/156),里面刚开始讲述了前端开发-调试-测试所使用的手段和工具,本人对前端开 ...
- grunt之concat、cssmin、uglify
周末有点懒,跑去看了<智取威虎山>,手撕鬼子的神剧情节被徐老怪一条回忆线就解释过去了,牛到极致尽是这种四两拨千斤的处理方式,手撕加分,四星推荐. --------------------- ...
- 初学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自动化地优化你的项目前端
在不久前我曾写了一篇 应用r.js来优化你的前端 的文章,为大家介绍了r.js这个实用工具,它可以很好地压缩.合并前端文件并打包整个项目.但是如果将r.js放到项目中,我们不得不顾及到一个问题——项目 ...
- Grunt(页面静态引入的文件地址的改变探究)-V2.0
相关插件的引用: grunt-usemin 对页面的操作 grunt-contrib-cssmin 压缩css load-grunt-tasks 瘦身gruntfile grunt-rev给md5 ...
- grunt自定义任务——合并压缩css和js
npm文档:www.npmjs.com grunt基础教程:http://www.gruntjs.net/docs/getting-started/ http://www.w3cplus.com/to ...
随机推荐
- javascript基础知识3#引用类
引用类 引用类型的只是引用类型的一个实例,在ecmascript当中,引用类型是一种数据结构用于将数据和功能组织在一起,也常被称做类. object类型 构造函数[var o = new object ...
- [NOIP模拟赛]约会date LCA(顺便填坑)
这道题也算是厉害了,改了整整俩小时最后发现是深信的LCA打错了,悲伤啊!信仰崩塌了! 顺便复习LCA,给出模板 void init(){//p[i][j]表示i节点2^j的祖先 int j; for( ...
- 基于注解的Spring MVC的简单入门——简略版
网上关于此教程各种版本,太多太多了,因为我之前没搭过框架,最近带着两个实习生,为了帮他们搭框架,我只好...惭愧啊...基本原理的话各位自己了解下,表示我自己从来没研究过Spring的源码,所以工作了 ...
- Oracle数据库 拾漏补缺
select语句的基本使用 可以查询需要的列,行,可以进行多表链接,连接查询. from p_emp e select 后面跟的是要显示的结果,可以是通过运算或者连接符号得出的伪列 null 空值 ...
- JavaScript操作cookie基础分析
简要介绍 cookie是什么cookie是HTTP协议的一部分.HTTP Cookie(也叫Web cookie或者浏览器Cookie)是服务器发送到用户浏览器并保存在浏览器上的一块数据,它会在浏览器 ...
- Java入门——(8)网络编程
关键词:IP地址..端口.UDP.DatagramPacket类.DatagramSocket类.TCP.ServerSocket类.Socket类.文件上传 一.基本概念 ...
- 开源社群系统ThinkSNS+PC端最新播报!
亲爱的粉丝,授权客户,企业创业者们,这一次,我们将为你们打造最好用的社交软件系统. 在这里你将看到TSer们本周研发.优化.设计的动态即时播报,可评论留言提出您的问题及建议与我们互动. 同时,研发已经 ...
- 用jlink在mini2440上烧写uboot
首先,附上我安装jlink驱动: http://download.csdn.net/detail/zzmno1/3776716#comment 以及我使用的uboot.bin文件下载地址: http: ...
- PACS发展历史
最先推动 PACS发展的动力来自于传统的相机厂家.这是因为当数字化浪潮到来的时候,他们首先就意识到这对他们的产品是一个不可逆转的巨大的冲击.他们当然有着自己的优势:对各个厂家的设备连接能力有着最为清楚 ...
- node.js之模块
node.js之模块 1.自定义模块的设置 加载自定义模块利用require: eg: require('./custom_module.js') 2.从模块外部访问模块内的成员 2.1使用expor ...