Generating a Source Map file using gruntjs, which its source attribute is explicitly set

I am trying to generate a source map file for my javascripts with grunt. I have tried two different grunt plugins but couldn't manage to obtain the desired result. Let me explain it over an example:

Example Project Structure

 /js
   person.js
   dog.js
 gruntfile.js
 index.html

with grunt-jsmin-sourcemap

'jsmin-sourcemap': {
  all: {
    // Source files to concatenate and minify (also accepts a string and minimatch items)
    src: ['*.js'],

    // Destination for concatenated/minified JavaScript
    dest: 'app.min.js',

    // Destination for sourcemap of minified JavaScript
    destMap: 'app.min.js.map',

    cwd: 'js',

    // Optional cwd to resolve from for all URLs
    // Converts jquery.js -> some/higher/directory/jquery.js during lookup but mapping preserves jquery.js in map file

  }
}

By using above options, grunt created me this source map:

{"version":3,"sources":["dog.js","person.js"],"names":[],"mappings":";AAAA,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAE,CAAE,CACT,CAAC,CAAC,CAAC,CAAC,CAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CACd,CAAC,CAAC,CAAC,CAAC,CAAC,CAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CACZ,CAAC,CAAC,CAAC,CAAE,CAAC,CACN,CAAC,CAAC,CAAC,CAAC,CAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CACb,CAAC;ACLD,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAE,CAAE,CACZ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CACjB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CACnB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAE,CACpB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAE,CAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAE,CAAE,CAAC,CAAC,CAAE,CAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAEnD,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CACd,CACD,CAAC","file":"app.min.js"}

Which is almost what I need. Two source files merged down to app.min.js, and the map file refers to this one single javascript file.

If I get a console error, It is possible to locate it on which individual source file (e.g person.js:7). Even though I included the merged app.min.js in my HTML.

However, jsmin part doesn't work as good as uglifyjs, and there is no available options to modify this process.

So, I decided to use uglifyjs's own sourceMap option.

with grunt-contrib-uglify

To make it work as intended, I also used grunt-contrib-concat plugin.

concat : {
  dist: {
    src: ['js/person.js','js/dog.js'],
    dest: 'js/app.js'  
  }
},

uglify: {
  dist : {
    options: {
      mangle: true,
      compress: true,
      sourceMap: true,
      sourceMapName: 'js/app.min.js.map'
    },
    files: {
      'js/app.min.js': ['js/app.js']
    }
  }
}

Options above led me this source map:

{"version":3,"file":"app.min.js","sources":["app.js"],"names":["person","firstname","lastname","fullname","this","myname","dog","name","breed","age","food"],"mappings":"AAAA,GAAIA,SACHC,UAAW,OACXC,SAAU,UACVC,SAAU,WACMC,KAAKH,UAAY,IAAMG,KAAKF,QAE3C,OAAOG,UAGLC,KACHC,KAAM,SACNC,MAAO,MACPC,IAAK,EACLC,KAAM"}

All my source file perfectly concatenated and minified as I desired, and also uglifyjs created even better source map file with names attributes. jsmin-sourcemap does not fill the names attribute, which I couldn't figure out why.

The problem is, sources attribute only includes app.js file. In the console error, It is not possible to determine on which individual source file the error is (e.g app.js:7)

What I need is a single, perfectly uglified javascript source file and a source map file which knows each and every source file included in the minified one.

If you guys can help me, I would appreciate it very much.

Thanks in advance!

**Challange: ** Use grunt-contrib-usemin plugin to concatenate and uglify only the desired javascript files and create a source map for those. I have tried flow and post options, but not succeeded

Happy Coding =)