Gruntfile.js
module.exports = function(grunt)
{
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
clean:
{
Task_001: //任务一
{
expand:true,
src:['build/**']
}
},
uglify: //js代码压缩
{
options:
{
mangle: false, //不混淆变量名
//stripBanners:'all',
//banner: '/*! <%= pkg.name %> <%= grunt.template.today("dd-mm-yyyy") %> */\n', //添加header
//footer:'\n/*! <%= pkg.name %> 最后修改于: <%= grunt.template.today("yyyy-mm-dd") %> */'//添加footer
},
Task_001: //任务一
{
files:
[
{
expand:true, //如果设为true,就表示下面文件名的占位符(即*号)都要扩展成具体的文件名。
cwd:"src/js", //src目录下
src:"**/*.js", //所有的文件夹中的js文件
dest:"build/js" //放在build文件夹中的js文件夹中
},
{
expand:true, //如果设为true,就表示下面文件名的占位符(即*号)都要扩展成具体的文件名。
cwd:"src/js", //src目录下
src:"*.js", //所有的js文件
dest:"build/js" //放在build文件夹中的js文件夹中
}
]
},
Task_002:
{
files:
[
{
expand:true, //如果设为true,就表示下面文件名的占位符(即*号)都要扩展成具体的文件名。
cwd:"src/js", //src目录下
src:"My_Js/*.js", //所有的文件夹中的js文件
dest:"build/js" //放在build文件夹中的js文件夹中
},
]
}
},
cssmin:
{
options:
{
report:'gzip'
},
Task_001: //任务一
{
files:
[
{
expand:true, //如果设为true,就表示下面文件名的占位符(即*号)都要扩展成具体的文件名。
cwd:'src/css', //css目录下
src:"**/*.css", //所有的文件夹中的css文件
dest:"build/css" //放在build文件夹中的css文件夹中
},
{
expand:true, //如果设为true,就表示下面文件名的占位符(即*号)都要扩展成具体的文件名。
cwd:'src/css', //css目录下
src:"*.css", //所有的css文件
dest:"build/css" //放在build文件夹中的css文件夹中
}
]
},
Task_002: //任务二
{
files:
[
{
expand:true, //如果设为true,就表示下面文件名的占位符(即*号)都要扩展成具体的文件名。
cwd:'src/css', //css目录下
src:"My_css/*.css", //所有的文件夹中的css文件
dest:"build/css" //放在build文件夹中的css文件夹中
}
]
},
},
imagemin:
{
Task_001: //任务一
{
options:
{
optimizationLevel: //定义 PNG 图片优化水平
},
files:
[
{
expand:true,//如果设为true,就表示下面文件名的占位符(即*号)都要扩展成具体的文件名。
cwd:'src/Images',//images目录下
src:'*.{png,jpg,jpeg,gif}',//所有的img文件
dest:'build/Images'//Images
},
{
expand:true,//如果设为true,就表示下面文件名的占位符(即*号)都要扩展成具体的文件名。
cwd:'src/Images',//images目录下
src:'**/*.{png,jpg,jpeg,gif}',//所有的img文件
dest:'build/Images'//Images
}
]
}
},
htmlmin:
{
//https://www.npmjs.com/package/html-minifier
options:
{
removeComments: true, //删除html注释
removeCommentsFromCDATA: true, //删除带HTML注释脚本和样式
removeCDATASectionsFromCDATA:true, //从脚本删除CDATA节和风格元素
collapseWhitespace:true, //崩溃的空白,导致文本节点在文档树。
conservativeCollapse:true, //总是省略空间必须使用与collapseWhitespace = true
collapseInlineTagWhitespace:true, //之间不要留下任何空间显示:内联元素时崩溃。必须使用与collapseWhitespace = true
preserveLineBreaks:false, //(false既开启超级压缩)总是省略换行之间的空白标签包含一个换行符。必须使用与collapseWhitespace = true
collapseBooleanAttributes:true, //省略属性值从布尔属性
removeTagWhitespace:true, //尽可能消除之间的空间属性。
removeAttributeQuotes:true, //删除引号属性。
removeRedundantAttributes:true, //删除属性值匹配时违约。
preventAttributesEscaping:true, //防止逃跑的属性的值。
useShortDoctype:true, //替换的doctype短(HTML5)doctype
removeEmptyAttributes:true, //删除所有空格作属性值
removeScriptTypeAttributes:true, //删除type = " text / javascript脚本标签。其他类型属性值剩下完好无损。
removeStyleLinkTypeAttributes:true, //删除类型= " text / css "从风格和链接标记。其他类型属性值剩下完好无损
removeOptionalTags:true, //删除没有要求标签
//removeEmptyElements:true, //删除所有元素空内容
keepClosingSlash:true, //保持尾部的斜杠单元素
caseSensitive:true, //以区分大小写的方式处理属性(用于自定义HTML标记。)
minifyJS:true, //压缩Javascript脚本元素和事件属性(使用UglifyJS)
minifyCSS:true, //压缩CSS样式元素和风格属性(使用clean-css)
minifyURLs:true, //压缩url在不同属性(使用relateurl)
includeAutoGeneratedTags:true, //插入标记生成的HTML解析器
quoteCharacter:true //类型的引用使用属性值(“或”)
},
Task_001: //任务一
{
files:
[
{
expand:true, //如果设为true,就表示下面文件名的占位符(即*号)都要扩展成具体的文件名。
cwd:"src", //app目录下
src:"**/*.html", //所有的文件夹中的html文件
dest:"build"//放在build文件夹中的html文件夹中
},
{
expand:true, //如果设为true,就表示下面文件名的占位符(即*号)都要扩展成具体的文件名。
cwd:"src", //html目录下
src:"*.html", //所有的html文件
dest:"build"//放在build文件夹中的html文件夹中
}
]
}
},
copy: //将编译好的文件,复制到我的项目中
{
Task_001: //任务一
{
files:
[
{
expand:true,
cwd:'build',
src:'**',
dest:'www'
}
]
}
},
watch: //自动监听文件的保存并执行指定的任务
{
Task_001: //任务一
{
files:['src/js/*.js','src/css/*.css','src/*.html'],
tasks:['uglify:Task_002','cssmin:Task_002','htmlmin'],
options:{ spawn:false}
}
}
});
//#####告诉grunt我们将使用的插件
grunt.loadNpmTasks('grunt-contrib-clean'); //js压缩
grunt.loadNpmTasks('grunt-contrib-uglify'); //js压缩
grunt.loadNpmTasks('grunt-contrib-cssmin'); //css压缩
grunt.loadNpmTasks('grunt-contrib-imagemin'); //image压缩
grunt.loadNpmTasks('grunt-contrib-htmlmin'); //html压缩
grunt.loadNpmTasks('grunt-contrib-copy'); //Copy文件和目录
grunt.loadNpmTasks('grunt-contrib-watch'); //监视文件
//#####告诉grunt我们在终端输入grunt时需要做一些什么
grunt.registerTask('default',['clean','uglify','cssmin','imagemin','htmlmin','copy','watch']);
};
Gruntfile.js的更多相关文章
- grunt使用watch和livereload的Gruntfile.js的配置
周末在家看angularJS, 用grunt的livereload的自动刷新, 搞了大半天, 现在把配置贴出来, 免得以后忘记了, 只要按照配置一步步弄是没有问题的; 开始的准备的环境安装是: (1) ...
- Grunt 自动化部署之css、image、javascript、html压缩Gruntfile.js配置
grunt.initConfig方法 用于模块配置,它接受一个对象作为参数.该对象的成员与使用的同名模块一一对应. 每个目标的具体设置,需要参考该模板的文档.就cssmin来讲,minify目标的参数 ...
- ☀【Grunt】package.json, Gruntfile.js, npm install, grunt
npm install --registry http://registry.npm.taobao.org/ 切换源 Grunt.js 在前端项目中的实战http://beiyuu.com/grunt ...
- 使用grunt-init自动创建gruntfile.js和package.json文件
使用grunt-init可以自动创建gruntfile.js和package.json文件.下面说一下过程: 1.全局安装grunt-init npm install -g grunt-init 2. ...
- Gruntfile.js模板
module.exports = function(grunt) { // 配置项 var AppConfig = { name: 'app', //源文件目录 src: 'app/src', //生 ...
- Gruntfile.js文件配置项
GRUNT安装与配置 Posted on 2016-08-19 18:13 听风吹来的种子 阅读(47) 评论(0) 编辑 收藏 安装 CLI npm install -g grunt-cli//全局 ...
- 编写可维护的 Gruntfile.js
load-grunt-tasks 插件 首先介绍下 load-grunt-tasks 这个插件. 我们一般都会把所有用到的插件以及插件的配置写到 Gruntfile.js 里面,对于小项目来说这个文件 ...
- Grunt:GruntFile.js
ylbtech-Grunt:GruntFile.js 1.返回顶部 1. module.exports = function (grunt) { grunt.initConfig({ useminPr ...
- 一路编程 -- Gruntfile.js
<一路编程> Steven Foote 第四章构建工具 中的 Gruntfile.js 文件的 JSHint 部分,如果按照书中所写,run grunt 的命令的时候会出错. 此处附上完 ...
- Javascript模块化开发2——Gruntfile.js详解
一.grunt模块简介 grunt插件,是一种npm环境下的自动化工具.对于需要反复重复的任务,例如压缩.编译.单元测试.linting等,自动化工具可以减轻你的劳动,简化你的工作.grunt模块根据 ...
随机推荐
- Laravel之Service Container服务容器
managing class dependencies and performing dependency injection. Dependency injection is a fancy phr ...
- Android如何缩减APK包大小
代码 保持良好的编程习惯,不要重复或者不用的代码,谨慎添加libs,移除使用不到的libs. 使用proguard混淆代码,它会对不用的代码做优化,并且混淆后也能够减少安装包的大小. native c ...
- 分享Kali Linux 2016.2第48周镜像文件
分享Kali Linux 2016.2第48周镜像文件Kali Linux官方于11月27日发布Kali Linux 2016.2的第48周镜像.这次延续以往规律,仍然是11个镜像文件.默认的Gnom ...
- 基于netty的微服务架构
基于netty的微服务架构 微服务一篇好文章 http://san-yun.iteye.com/blog/1693759 教程 http://udn.yyuap.com/doc/essential-n ...
- Java数组课后作业
1.运行TestArrays.java,了解Arrays中的一些重要方法的用法. Arrays.equals(a 1, a2):判断数组是否相等. int[] b = Arrays.copyOf(a, ...
- 并查集(涂色问题) HDOJ 4056 Draw a Mess
题目传送门 题意:给出一个200 * 50000的像素点矩阵,执行50000次操作,每次把一个矩形/圆形/菱形/三角形内的像素点涂成指定颜色,问最后每种颜色的数量. 分析:乍一看,很像用线段树成段更新 ...
- BOM和DOM的区别和关联
BOM 1. BOM是Browser Object Model的缩写,即浏览器对象模型. 2. BOM没有相关标准. 3. BOM的最根本对象是window. 从1可以看出来:BOM和浏览器关系密切. ...
- iOS学习13之OC NSString类
C语言中,字符串是有char(ASC||码)字符组成. OC中,字符串是由unichar(Unicode)字符组成. 1.字符串(NSString) NSString:不可变字符串,即:创建以后,内容 ...
- ssh myeclipse的bug
1 有时候复制完一个类的时候,myeclispe会少复制一些方法.很坑爹.复制的时候最好从新创建让后粘贴 2 有时候jsp页面经过修改该以后,在网页上显示的还是原来的页面,很坑爹.删掉tomcat然后 ...
- UVa 10806 & 费用流+意识流...
题意: 一张无向图,求两条没有重复的从S到T的路径. SOL: 网络流为什么屌呢..因为网络流的容量,流量,费用能对许许多多的问题进行相应的转化,然后它就非常的屌. 对于这道题呢,不是要没有重复吗?不 ...