grunt-contrib-requirejs插件合并压缩requirejs管理的Angularjs应用-优快云博客

本文介绍如何通过Gruntfile.js配置grunt-contrib-requirejs插件，实现对由requirejs管理的AngularJS应用程序进行合并和压缩。配置包括设置baseUrl、主文件名、压缩工具类型、主配置文件和输出文件。此外，还使用grunt-contrib-concat和grunt-contrib-cssmin分别合并CSS和压缩CSS，以及使用grunt-contrib-watch监听文件变化自动执行任务。

Fruntfile.js

'use strict'
module.exports = function(grunt) {
    // 配置
    grunt.initConfig({
        pkg : grunt.file.readJSON('package.json'),
        requirejs : {
            build : {
                options : {
                    baseUrl : 'frontend',
                    name:'config/main',    //主文件名字
                    optimize:'uglify',   //指定压缩工具类型使用uglify工具压缩
                    mainConfigFile: 'frontend/config/main.js', //require 的主文件
                    out:'build/all.js'       //压缩后的文件
                    //其他无需指定本插件会自动寻找require引进的所有文件
                }
            }
        },
        concat : {
            css : {
                src : ['frontend/styles/*.css'],
                dest : 'dist/index.css'
            }
        },
        cssmin : {
            buildCss : {
                src : 'dist/index.css',
                dest : 'dist/index.min.css'
            }
        },
        watch : {
            alljs : {
                files :['frontend/styles/*.css'],
                tasks : ['concat', 'cssmin']
            },
            allcs : {
                files :['frontend/**/*.js'],
                tasks : ['requirejs']
            }
        }
    });
    // 载入concat和uglify插件，分别对于合并和压缩
    grunt.loadNpmTasks('grunt-contrib-concat');
    grunt.loadNpmTasks('grunt-css');
    grunt.loadNpmTasks('grunt-contrib-requirejs');
    grunt.loadNpmTasks('grunt-contrib-watch');
    // 注册任务
    grunt.registerTask('default', ['concat', 'cssmin', 'requirejs', 'watch']);
};