Grunt useminPrepare and usemin not working with multiple tasks and files (concat fails)

Question

I want two targets in my project. One for admin and one for user pages. I don't want the admin plugins to be included in user pages for performance reasons. However I get this error while trying to run a build:

Running "useminPrepare:admin" (useminPrepare) task
Configuration changed for concat, uglify, cssmin

Running "useminPrepare:user" (useminPrepare) task
Configuration changed for concat, uglify, cssmin

No "concat" targets found.
Warning: Task "concat" failed. Use --force to continue.

I can't find a concat task in GruntFile.js to see what's wrong. My GruntFile.js usemin tasks are as follows:

    useminPrepare: {
        admin: {
            html: 'app/admin-index.html',
            options: {
                dest: 'dist'
            }
        },
        user: {
            html: 'app/index.html',
            options: {
                dest: 'dist'
            }
        },
    },
    usemin: {
        admin: {
            html: 'dist/admin-index.html'
        },
        user: {
            html: 'dist/index.html'
        }
    }

grunt.registerTask('build', [
    'clean:dist',
    'less',
    'useminPrepare:admin',
    'useminPrepare:user',
    'concat',
    'copy:dist',
    'cssmin',
    'uglify',
    'filerev',
    'usemin:admin',
    'usemin:user',
    'htmlmin'
]);

And the html counterparts are following for js files. First the admin-index.html:

<!-- build:js(.) scripts/vendor.js -->

<!-- jQuery and Bootstrap -->
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>

<!-- MetsiMenu -->
<script src="bower_components/metisMenu/dist/metisMenu.min.js"></script>

<!-- Peace JS -->
<script src="bower_components/pace/pace.min.js"></script>

<!-- Angular scripts-->
<script src="bower_components/angular/angular.min.js"></script>
<script src="bower_components/angular-ui-router/release/angular-ui-router.min.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js"></script>

<!-- Angular Dependiences -->
<!--                      -->
<!--                      -->
<!--                      -->

<!-- Datatables -->
<script src="bower_components/datatables.net/js/jquery.dataTables.min.js"></script>
<script src="bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>
<script src="bower_components/datatables.net-buttons/js/dataTables.buttons.min.js"></script>
<script src="bower_components/jszip/dist/jszip.min.js"></script>
<script src="bower_components/pdfmake/build/pdfmake.min.js"></script>
<script src="bower_components/pdfmake/build/vfs_fonts.js"></script>
<script src="bower_components/datatables.net-buttons/js/buttons.html5.min.js"></script>
<script src="bower_components/datatables.net-buttons/js/buttons.print.min.js"></script>
<script src="bower_components/datatables.net-buttons/js/buttons.colVis.min.js"></script>

<!-- Datepicker -->
<script src="bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script>
<script src="bower_components/bootstrap-datepicker/dist/locales/bootstrap-datepicker.tr.min.js"></script>
<script src="bower_components/datepair.js/dist/datepair.js"></script>

<!-- Timepicker -->
<script src="bower_components/jt.timepicker/jquery.timepicker.js"></script>

<!-- endbuild -->

<!-- build:js({.tmp,app}) scripts/scripts.js -->
<!-- Custom and plugin javascript -->
<script src="scripts/inspinia.js"></script>

<!-- Anglar App Script -->
<script src="scripts/app.js"></script>
<script src="scripts/config.js"></script>
<script src="scripts/directives.js"></script>
<script src="scripts/controllers.js"></script>
<!-- endbuild -->

And now the index.html file:

<!-- build:js(.) scripts/uivendor.js -->

<!-- jQuery and Bootstrap -->
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>

<!-- Datepicker -->
<script src="bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script>
<script src="bower_components/bootstrap-datepicker/dist/locales/bootstrap-datepicker.tr.min.js"></script>

<!-- endbuild -->

Answer 1

Perhaps You do not have a concat parameter above in the initConfig settings in Gruntfile.js, but have it set in the "BUILD" command. Grunt does not know what that concat string relates to so it throws an error

try removing 'concat' like below

grunt.registerTask('build', [
   'clean:dist',
   'less',
   'useminPrepare:admin',
   'useminPrepare:user',
   'copy:dist',
   'cssmin',
   'uglify',
   'filerev',
   'usemin:admin',
   'usemin:user',
   'htmlmin'
]);

or adding a concat key in your config settings Example below

  concat: {
    options: {
      separator: ';',
    },
    dist: {
      src: ['src/file1.js', 'src/file2.js', 'src/file3.js'],
      dest: 'dist/concat-file.js',
    },
   },

Answer 2

Merging the two tasks solved the problem for me. Although explicitly declaring concat, cssmin, uglify etc. tasks as Vijay suggested is an option too, It's just too cumbersome. I changed the GruntFile.js as follows:

    useminPrepare: {
        html: ['app/admin-index.html', 'app/index.html'],
        options: {
            dest: 'dist'
        }
    },
    usemin: {
        html: ['dist/admin-index.html', 'dist/index.html'],
    }

grunt.registerTask('build', [
    'clean:dist',
    'less',
    'useminPrepare',
    'concat',
    'copy:dist',
    'cssmin',
    'uglify',
    'filerev',
    'usemin',
    'htmlmin'
]);