Grunt outputs an empty .js-file after concatting

Question

The output of the Gruntfile is an empty file in public/assets/app.js. The Sass-part works fine, but the JS-part doesn't.

//Gruntfile 
module.exports = function(grunt) {

  //Initializing the configuration object
    grunt.initConfig({

    // Task configuration
    sass: {
        dist: {
             options: {
              style: 'compressed'
            },
            files: {
              './public/assets/app.css': './app/assets/scss/style.scss'
            },
            noCache: true
        }
    },
    concat: {
      options: {
        separator: ';',
      },
      dist: {
        src: [
          './app/bower/jquery/jquery.js',
          './app/assets/js/script.js'
        ],
        dest: './public/assets/app.js',
      },
    },
    uglify: {
      options: {
        mangle: false 
      },
      dist: {
        files: {
          './public/assets/app.js': './public/assets/app.js',
        }
      },
    },
    jshint: {
      all: ['Gruntfile.js', './public/assets/app.js']
    },
    watch: {
        js: {
          files: [
            './app/assets/bower/*.js',
            './app/assets/js/*.js'
            ],   
          tasks: ['jshint', 'concat', 'uglify'],  
          options: {
            livereload: false 
          }
        },
        sass: {
          files: ['./app/assets/scss/*.scss'],
          tasks: ['sass'], 
          options: {
            livereload: false  
          }
        }
      }
    });

  // Plugin loading
  grunt.loadNpmTasks('grunt-contrib-concat');
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-contrib-sass');
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-jshint');

  // Task definition
  grunt.registerTask('default', ['sass', 'jshint', 'concat', 'uglify', 'watch']);

};

But I can't find out what is wrong. Even JShint isn't showing errors. Structure looks like this: https://www.dropbox.com/s/y0t2tu0asotz0ex/Screenshot%202013-12-20%2020.49.54.png

Typically an empty concat file is because the concat task didn't find the source files. Without seeing your directory structure it would be hard to say whether your Gruntfile is correct or not. — Jordan Kasper, Dec 20 '13 at 19:44
This is the structure: https://www.dropbox.com/s/y0t2tu0asotz0ex/Screenshot%202013-12-20%2020.49.54.png — user1469734, Dec 20 '13 at 19:51
Are you able to run `grunt concat` by itself with any success? Or same result? I would also try just using `'app/bower/jquery/jquery.js'` (no "./" in front) - I know it shouldn't matter, but... — Jordan Kasper, Dec 20 '13 at 20:35
Nope. Just the same. And Grunt concat just works: ```Running "concat:dist" (concat) task File "./public/assets/app.js" created. Done, without errors.``` — user1469734, Dec 20 '13 at 21:59
Wait, so does `grunt concat` work and produce a file with everything in it? If so, my guess is that it's your `uglify` task. In that case, try making the output name of the uglify task something else (like `app.min.js`). — Jordan Kasper, Dec 20 '13 at 22:06
Also running your grunt tasks with the -verbose option will sometimes help you figure out the problem. Definitely sounds like it's the uglify task that is causing the problem though if running grunt concat by itself is working. — ThePuzzleMaster, Dec 20 '13 at 23:13
It says ```grunt concat``` works, but it gives an empty file. that is the strange thing about it al. When I run it with the Verbose flag, it says for some reason something that is pretty obvious: ```Files: [no src] -> public/assets/app.js``` — user1469734, Dec 20 '13 at 23:47
This works now: ```'/var/www/app/assets/bower/jquery/jquery.js'```, but that shouldn't be the solution... — user1469734, Dec 21 '13 at 00:08
Are you sure it's concat and not uglify? I am having a similar issue, but concat works and uglify doesn't. Also the repo https://github.com/gruntjs/grunt-contrib-uglify looks like the build is failing. https://github.com/gruntjs/grunt-contrib-uglify/issues/162 This seems to be a more recent issue than this question though. — Dave Albert, Mar 12 '14 at 06:44

score 8 · Answer 1 · answered Dec 23 '13 at 16:03

Taking another look at your Gruntfile and directory structure, I think you have the folders specified incorrectly, You specify the source as being ./app/..., but if your Gruntfile is in that directory (app), then you would have to be running your grunt tasks from there, meaning it would be looking for app/app/... (because it's relative to the current directory). Try this:

concat: {
  options: {
    separator: ';',
  },
  dist: {
    src: [
      'bower/jquery/jquery.js',
      'assets/js/script.js'
    ],
    dest: 'public/assets/app.js',
  },
},

score 0 · Answer 2 · edited Dec 28 '16 at 21:11

My solution is set correct filepath: Scripts/libs/Timer.js - correct, /Scripts/libs/Timer.js - empty file Scripts is a folder into my project. Project/Scripts/libs/Timer.js - full path. when I set this path: Scripts/libs/Timer.js - file isn't empty, when /Scripts/libs/Timer.js - file is empty.

concat: {
            options:{
                // define a string to put between each file in the concatenated output
                separator: '\n;'
            },
            own_scripts: {
                //project-files
                src: [
                    "Scripts/application/app.js",
                    "Scripts/application/Controllers/*.js",
                    "Scripts/application/Directives/*.js",
                    "Scripts/application/Filters/*.js",
                    "Scripts/application/Services/*.js"
                ],
                dest: 'dist/scripts-concat.js'
}

maybe you should do this:

    dist: {
        src: [
          'app/bower/jquery/jquery.js',
          'app/assets/js/script.js'
        ],
        dest: 'public/assets/app.js',
      },

Grunt outputs an empty .js-file after concatting

2 Answers2