用grunt合并requireJS的模块文件,压缩css,images

lcyangcss 2015-07-20

   package.json

  

{
  "name": "grunt-test",
  "version": "0.1.0",
  "devDependencies": {
    "grunt": "~0.4.2",
    "grunt-contrib-jshint": "~0.7.2",
    "jpegtran-bin": "0.2.0",
    "grunt-contrib-uglify": "~0.2.7",
    "grunt-contrib-concat": "~0.3.0",
    "grunt-contrib-less": "~0.9.0",
    "grunt-contrib-cssmin": "~0.7.0",
    "grunt-contrib-htmlmin": "~0.1.3",
    "grunt-contrib-imagemin": "~0.4.1",
    "grunt-contrib-requirejs": "~0.4.1",
    "grunt-csscomb": "~2.0.1",
    "requirejs": "~2.1.10"
  }
}

   Gruntfile.js

/*global module*/
module.exports = function(grunt) {
    grunt.initConfig({
        // 引入模块包
        pkg: grunt.file.readJSON('package.json'),
        // css压缩
        csscomb: {
            options: {
                config: './dev/styles/less/csscomb.json'
            },
            files: {
                expand: true,
                cwd: './dev/styles/',
                src: ['**/*.css'],
                dest: './dev/styles/',
                ext: '.css'
            }
        },
        // require模块合并
        requirejs: {
            build: {
                options: {
                    // app顶级目录,非必选项。如果指定值,baseUrl则会以此为相对路径
                    appDir: './dev',
                    // 模块根目录。默认情况下所有模块资源都相对此目录。
                    // 若该值未指定,模块则相对build文件所在目录。
                    // 若appDir值已指定,模块根目录baseUrl则相对appDir。
                    baseUrl: 'js',
                    // 指定输出目录,若值未指定,则相对 build 文件所在目录
                    dir: './build',
                    // JS 文件优化方式,目前支持以下几种:
                    //   uglify: (默认) 使用 UglifyJS 来压缩代码
                    //   closure: 使用 Google's Closure Compiler 的简单优化模式
                    //   closure.keepLines: 使用 closure,但保持换行
                    //   none: 不压缩代码
                    optimize: "uglify",
                    // 使用 UglifyJS 时的可配置参数
                    // See https://github.com/mishoo/UglifyJS for the possible values.
                    uglify: {
                        toplevel: true,
                        ascii_only: true,
                        beautify: true,
                        max_line_length: 1000
                    },
                    // 是否开启严格模式
                    // 由于很多浏览器不支持 ES5 的严格模式,故此配置默认值为 false
                    useStrict: false,
                    // 处理级联依赖,默认为 false,此时能够在运行时动态 require 级联的模块。为 true 时,级联模块会被一同打包
                    findNestedDependencies: false,
                    /*optimize: 'uglify2',
                    generateSourceMaps: false,
                    preserveLicenseComments: false,*/
                    // useSourceUrl: true,
                    // CSS 优化方式,目前支持以下几种:
                    // none: 不压缩,仅合并
                    // standard: 标准压缩,移除注释、换行,以及可能导致 IE 解析出错的代码
                    // standard.keepLines: 除标准压缩外,保留换行
                    // standard.keepComments: 除标准压缩外,保留注释 (r.js 1.0.8+)
                    // standard.keepComments.keepLines: 除标准压缩外,保留注释和换行 (r.js 1.0.8+)
                    optimizeCss: "standard.keepLines",

                    // 是否忽略 CSS 资源文件中的 @import 指令
                    cssImportIgnore: null,
                    // 设置模块别名
                    // RequireJS 2.0 中可以配置数组,顺序映射,当前面模块资源未成功加载时可顺序加载后续资源
                    paths: {
                        'jquery': 'libs/jquery-1.8.2',
                        'a': 'utils/a',
                        'b': 'utils/b',
                        'c': 'utils/c',
                        'd': 'utils/d',
                        'e': 'utils/e',
                        'de': 'app/de'
                    },
                    // 配置别名及依赖
                    shim: {

                    },
                    // 配置打包模块
                    modules: [{
                        // 模块 alias 名称
                        name: 'de'
                    }],
                    // 输出内容  RequireJS 2.0 中,out 可以是一个函数,也可以指定为一个输出文件地址
                    out: function (text) {
                        // 自定义优化内容
                    }
                }
            }
        },
        imagemin: {
            /* 压缩图片大小 */
            dist: {
                options: {
                    // 压缩级别
                    optimizationLevel: 4
                },
                files: [{
                    expand: true,
                    cwd: './dev/images/',
                    src: ['**/*.{jpg,png,gif}'],
                    dest: './build/images/'
                }]
            }
        }
    });
    grunt.loadNpmTasks('grunt-csscomb'); // css属性指定
    grunt.loadNpmTasks('grunt-contrib-jshint'); //js检查
    grunt.loadNpmTasks('grunt-contrib-imagemin'); //图像压缩
    grunt.loadNpmTasks('grunt-contrib-requirejs'); //requirejs优化


    // 注册任务
    grunt.registerTask('default', ['csscomb', 'requirejs', 'imagemin']);
};

相关推荐