Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Uglify with SourceMaps while using grunt usemin and rev

I want to log javascript errors to server but the stacktrace is not useful with minified JS code. So I was thinking of using either Getsentry or Rollbar which shows proper stack trace with the help of sourcemaps. But I'm struggling to create sourcemap in first place.

I'm getting this error

"Destination (_build/js/app.js) not written because src files were empty."

Once it creates source map properly, there will be another problem i.e. rev will rename the file. I also need to leave the unminified concatenated file.

Below is my gruntfile.js (I've removed few bits out of it.)

module.exports = function(grunt) {

    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        clean: {
            jsFolders: {
                src: [
                    '_build/js/ui',
                    '_build/js/vendor',
                    '_build/js/app',
                    '_build/js/*templates.js'
                ]
            },
            build: {
                src: ['_build/**/*']
            }
        },

        copy: {
            build: {
                files: [{
                    expand: true,
                    src: [
                        'index.html',
                        'img/**/*', //includes web.cofig also.
                        'img/**/*.svg',
                        '!img/**/*.psd',
                        'js/**/*', //includes web.cofig also.
                        'css/**/*', //includes web.cofig also.
                        '*.png',
                        'favicon.ico'
                    ],
                    dest: '_build/'
                }]
            },
        },

        rev: {
            option: {
                algorithm: 'sha1',
                length: 4
            },
            all: {
                files: {
                    src: [
                        '_build/**/*.{js,css,eot,ttf,woff}'
                    ]
                }
            }
        },

        useminPrepare: {
            html: ['_build/index.html']
        },

        usemin: {
            html: [
                '_build/index.html'
            ],
            css: [
                '_build/css/**/*.css'
            ]
        },

        uglify: {
            options: {
                sourceMap: '_build/js/app.js.map',
            },
            js: {
                files: {
                    '_build/js/app.js': ['_build/js/app.js']
                }
            }
        },

        cssmin: {
            minify: {
                expand: true,
                cwd: '_build/css/',
                src: '*.css',
                dest: '_build/css/'
            }
        },
    });

grunt.registerTask('build', [
        'clean:build',
        'handlebars',
        'compass',
        'autoprefixer',
        'copy:build',
        'useminPrepare',
        'concat',
        'uglify',
        'cssmin',
        'clean:jsFolders',
        'rev',
        'usemin',
    ]);

};

UPDATE


Tried @Andy's solution, it still shows the same error "Destination (_build/js/app.js) not written because src files were empty." and it also says below while building

 uglify:
  { options:
   { sourceMap: true,
     sourceMapName: '_build/js/app.js.map' },
  js: { files: { '_build/js/app.js': [ '_build/js/app.js' ] } },
  generated:
   { files:
      [ { dest: 'dist\\js\\app.js',
          src: [ '.tmp\\concat\\js\\app.js' ] } ] } }

Don't know where it got dest name from. My output folder is _build.

UPDATE2:
Refer to below links for better solution
https://stackoverflow.com/a/20574196/148271 https://github.com/gruntjs/grunt-contrib-uglify/issues/39#issuecomment-14856100

like image 782
IsmailS Avatar asked Feb 24 '14 15:02

IsmailS


2 Answers

useminPrepare is merging the existing uglify config with its own, but nested under generated. Therefore this configuration for uglify works for me

grunt.initConfig({
  uglify: {
    generated: {
      options: {
        sourceMap: true
      }
    }
  }
});
like image 186
Andreas Avatar answered Oct 13 '22 23:10

Andreas


There is no simple solution to getting sourcemaps to work with the usemin flow. Its a known problem that hasnt been addressed in a year it seems:

https://github.com/yeoman/grunt-usemin/issues/30

https://github.com/yeoman/grunt-usemin/issues/220

like image 40
Vlad Gurovich Avatar answered Oct 13 '22 23:10

Vlad Gurovich