0

File structure.

/app 
  /components 
     /core 
        /extensions
           - array.js 
           - string.js
        /services
           - logger.js 
        /lib 
           - core.js 

Core.js

(function() {
     'use strict';
     angular.module('app.core',[]);  
}());

What i need is to overwrite core.js on each build by copying all the other js files in that folder on to it, while keeping this first original content of the module deceleration.

This is the wanted result for Core.js :

(function() {
     'use strict';
     angular.module('app.core',[]);  
}());
// content of array.js
(function() {
   'use strict';

    var core = angular.module('app.core');
    core.config( .....) 
 }());     

 // content of string.js
 ...
 // content of logger.js

Iv'e tried 2 grunt tasks which i believed where men't for this purpose but did not find a way the configure them to my needs.

1) grunt-concat had 2 issues the first that it appends the contents from the start of the file and not the end of the file like i wanted. and it does not override the existing content.

2) grunt-copy does override but it overrides the entire file.

What iv'e attempted is to use the process function for grunt copy.

  copy: {
      src: ['app/components/core/{,*/}*.js'],
      dest: 'app/components/core/lib/core.js',
      options:{
          process : function(content, srcpath){
              return content; // do some manipulation on content here. 
          }
      }         
  }

This is also problematic since i would have to keep the text that comprises the angular module definition in my Gruntfile and append it to the first content that comes into my process function, something like this which seems really messy.

 process : function(content, srcpath){
              if(isFirst) {
                  isFirst = false;
                  // here i will append the angular module deceleration. 
              }
              return content;
          }

Is there an elegant way to achieve what iv'e described ?

1 Answer 1

1

grunt-contrib-concat is exactly what you need, just do the following:

  1. rename your current core.js to _banner.js (or anything you like) - it's a good practice to not overwrite your banner file anyway
  2. setup concat to agregate _banner.js then your other files, and save it as core.js:

    concat: {
      core: {
        files: [{
          src: [
            'app/components/core/_banner.js',
            'app/components/core/extensions/*.js',
            'app/components/core/services/*.js'
          ],
          dest: 'app/components/core/lib/core.js'
        }]
      },
    },
    

Should give you what you want

Sign up to request clarification or add additional context in comments.

5 Comments

i thought so as well but i have 2 issues with grunt concat as iv'e stated in my question above. i would have to first some how clean the file completely since it will concatenate every thing every time. the second is that it concatenates to the start of the file and not the end of the file
files :[ ... ] tries to create a directory with files under core.js which fails. what you did teach me is that i can control the order of the concatenation using an array of sources. i still have the problem that i need to some how clean my core.js file before the next concat.
I would advise not to use the same file as input and output (core.js) - that way cleaning and start/end of file problems go away : delete core.js (use grunt-contrib-clean), then re-generate from your files.
and I edited my answer to fix the issue of grunt creating a core.js directory (caused by my expand:true option)
it turns out concat is smart enough to diff between the current core.js and the next concat attempt. i accedently copied core.js again on to itself.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.