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的更多相关文章

  1. grunt使用watch和livereload的Gruntfile.js的配置

    周末在家看angularJS, 用grunt的livereload的自动刷新, 搞了大半天, 现在把配置贴出来, 免得以后忘记了, 只要按照配置一步步弄是没有问题的; 开始的准备的环境安装是: (1) ...

  2. Grunt 自动化部署之css、image、javascript、html压缩Gruntfile.js配置

    grunt.initConfig方法 用于模块配置,它接受一个对象作为参数.该对象的成员与使用的同名模块一一对应. 每个目标的具体设置,需要参考该模板的文档.就cssmin来讲,minify目标的参数 ...

  3. ☀【Grunt】package.json, Gruntfile.js, npm install, grunt

    npm install --registry http://registry.npm.taobao.org/ 切换源 Grunt.js 在前端项目中的实战http://beiyuu.com/grunt ...

  4. 使用grunt-init自动创建gruntfile.js和package.json文件

    使用grunt-init可以自动创建gruntfile.js和package.json文件.下面说一下过程: 1.全局安装grunt-init npm install -g grunt-init 2. ...

  5. Gruntfile.js模板

    module.exports = function(grunt) { // 配置项 var AppConfig = { name: 'app', //源文件目录 src: 'app/src', //生 ...

  6. Gruntfile.js文件配置项

    GRUNT安装与配置 Posted on 2016-08-19 18:13 听风吹来的种子 阅读(47) 评论(0) 编辑 收藏 安装 CLI npm install -g grunt-cli//全局 ...

  7. 编写可维护的 Gruntfile.js

    load-grunt-tasks 插件 首先介绍下 load-grunt-tasks 这个插件. 我们一般都会把所有用到的插件以及插件的配置写到 Gruntfile.js 里面,对于小项目来说这个文件 ...

  8. Grunt:GruntFile.js

    ylbtech-Grunt:GruntFile.js 1.返回顶部 1. module.exports = function (grunt) { grunt.initConfig({ useminPr ...

  9. 一路编程 -- Gruntfile.js

    <一路编程> Steven Foote 第四章构建工具 中的 Gruntfile.js 文件的 JSHint 部分,如果按照书中所写,run  grunt 的命令的时候会出错. 此处附上完 ...

  10. Javascript模块化开发2——Gruntfile.js详解

    一.grunt模块简介 grunt插件,是一种npm环境下的自动化工具.对于需要反复重复的任务,例如压缩.编译.单元测试.linting等,自动化工具可以减轻你的劳动,简化你的工作.grunt模块根据 ...

随机推荐

  1. 静态局部变量、静态全局变量、extern全局变量、自动变量 札记

    静态局部变量 静态局部变量. 从称呼上我们可以看出,静态局部变量首先是一个局部变量,因此其只在定义它的函数内有效,冠以静态的头衔后,其生存期就被延长了,不会随着函数的返回而被撤销.我们可以这样来理解: ...

  2. JavaScript设计模式——方法的链式调用

    方法的链式调用: (function() { //私有类 function _$ (els) { this.elements = []; for(var i = 0, len = els.length ...

  3. 移动Web开发规范

    1.字体设置 使用无衬线字体 body { font-family: "Helvetica Neue", Helvetica, STHeiTi, sans-serif; } 2.设 ...

  4. 8611 大牛之路I

    时间限制:500MS  内存限制:1000K 提交次数:157 通过次数:62 题型: 编程题   语言: C++;C Description 要成为ACM大牛,要掌握很多必需的知识点.某些知识点可以 ...

  5. Python profiling

    Profiling(性能调试)是我一直很感兴趣的一个话题,之前给大家介绍过Datadog这个工具,今天我们来看看Python语言中有哪些方法来做Profiling. Poorman's Profile ...

  6. Java keytool 使用总结

    Keytool 是一个Java 数据证书的管理工具 ,Keytool 将密钥(key)和证书(certificates)存在一个称为keystore的文件中. 在keystore里,包含两种数据: ( ...

  7. BZOJ3542:DZY Loves March

    询问是要求 $\sum_{i=1}^n((x[i]-a)^2+(y[i]-b)^2)(x[i]=a||y[i]=b)$ 即求 $\sum_{i=1}^n(x[i]-a)^2(y[i]=b)+\sum_ ...

  8. CUDA程序设计(二)

    算法设计:直方图统计 直方图频数统计,也可以看成一个字典Hash计数.用处不是很多,但是涉及CUDA核心操作:全局内存.共享内存.原子函数. 1.1  基本串行算法 这只是一个C语言练习题. #def ...

  9. 51Nod 1021 石子合并 Label:Water DP

    N堆石子摆成一条线.现要将石子有次序地合并成一堆.规定每次只能选相邻的2堆石子合并成新的一堆,并将新的一堆石子数记为该次合并的代价.计算将N堆石子合并成一堆的最小代价.   例如: 1 2 3 4,有 ...

  10. 洛谷 P1433 吃奶酪 Label:dfs && 剪枝Ex

    题目描述 房间里放着n块奶酪.一只小老鼠要把它们都吃掉,问至少要跑多少距离?老鼠一开始在(0,0)点处. 输入输出格式 输入格式: 第一行一个数n (n<=15) 接下来每行2个实数,表示第i块 ...