angularjsgrunt-contrib-concat

How to use concatenation/uglification with AngularJS without specifically setting each file in an order


I am building a project with AngularJS and I hope to use Grunt and grunt-contrib-concat (or something similar) to get all my angular components concatenated to one file.

AngularJS components need to be concatenated in order, so that files with module declarations precede files which reference those modules.

It looks like, if you specify each individual file in the Grunt task, it uses the order in which they are specified. However, I was hoping to find a solution that let's me configure rules by which an entire directory tree of files is ordered, so I don't need to specify individual files.

Ideally, I would want the program to go through the file tree and load files higher up in the tree first. I could then use a structure like:

moduleFolder
  -> controllerFolder
      -> example.ctrl.js
      -> exampleAlternate.ctrl.js
  -> directiveFolder
      -> example.directive.js
  -> exampleModuleDeclaration.js

Can anyone suggest how this might be accomplished, or what the accepted way of doing AngularJS with concatenation is?


Solution

  • 'use strict';

    module.exports = function(grunt) {

    grunt.initConfig({
        distFolder: '../scripts',
        pkg: grunt.file.readJSON('package.json'),
        concat: {
            options: {
                separator: ';'
            },
            scripts: {
                src: [
                    '../app.js',
                    '../controllers/*.js',
                    '../controllers/*/*.js',
                    '../services/*.js',
                    '../directives/*.js',
                    '../filters/*.js',
                    '../factories/*.js'
                ],
                dest: '<%= distFolder %>/file_name.js'
            }
        }
    });
    grunt.loadNpmTasks('grunt-contrib-concat');
    grunt.registerTask('default', ['concat']);
    

    };

    try this and keep in mind the folder structure. its saving into scripts folder