browserify: concatenated browserified files => error _prelude.js vs. loading separate files work

Question

Running into a problem when concatenating two browserified files (vendor.js and app.js into combined.js)

Loading combined.js in the browser throws the following in _prelude.js :

Uncaught Error: Cannot find module 'function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);throw new Error("Cannot find module '"+o+"'")}var f=n[o]={exports:{}};t[o][0].call(f.exports,function(e){var n=t[o][1][e];return s(n?n:e)},f,f.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s}'

while loading the browserified files individually works just fine.

What am I missing?
(let me know if you need more config, happy to provide)

Thanks for your help!

In Gruntfile.js:

browserify: {
        vendor: {
            src: ['client/requires/**/*.js'],
            dest: 'build/vendor.js',
            options: {
                shim: {
                    jquery: {
                        path: 'client/requires/jquery/js/jquery.js',
                        exports: '$'
                    },
                    underscore: {
                        path: 'client/requires/underscore/js/underscore.js',
                        exports: '_'
                    },
                    backbone: {
                        path: 'client/requires/backbone/js/backbone.js',
                        exports: 'Backbone',
                        depends: {
                            underscore: 'underscore'
                        }
                    },
                    'backbone.marionette': {
                        path: 'client/requires/backbone.marionette/js/backbone.marionette.js',
                        exports: 'Marionette',
                        depends: {
                            jquery: '$',
                            backbone: 'Backbone',
                            underscore: '_'
                        }
                    },
                    eventsource: {
                        path: 'client/requires/eventsource/eventsource.js',
                        exports: 'EventSource'
                    },
                    moment: {
                        path: 'client/requires/moment/moment.js',
                        exports: 'moment'
                    },
                    bootstrap: {
                        path: 'client/requires/bootstrap/js/bootstrap.js',
                        exports: null
                    }
                }
            }
        },
        app: {
            files: {
                'build/app.js': ['client/src/main.js']
            },
            options: {
                transform: ['node-underscorify'],
                debug: true,
                external: ['jquery', 'underscore', 'backbone', 'backbone.marionette', 'eventsource', 'moment', 'bootstrap']
            }
        },
    },

    concat: {
        'build/<%= pkg.name %>.js': ['build/vendor.js', 'build/app.js']
    },

Answer 1

I have done some initial investigation and there appears to be a definite problem with the preamble. I've raised an issue with the grunt-browserify maintainers so lets see what comes of that.

For now I am concatenating a file between vendor.js and app.js as a way to fix the preamble as follows:

Gruntfile.js

concat: {
        'build/<%= pkg.name %>.js': ['build/vendor.js', 'client/src/fix_browserify', 'build/app.js']
    },

fix_browserify

require=

Note there is no carriage return or linefeed in the above file

I am unsure if there will be any unintended consequences of defining require twice but it appears to be working in my limited use. If you have more than just one app bundle then you would similarly need to interleave concatenation of the fix_browserify file before each of the bundles.

If I become aware of any better solutions I'll update this answer.

UPDATE

I ended up ditching grunt/browserify after looking at how browerify worked and just went with brunch which was far easier to setup and also does much faster rebuilds when things change. Whilst not a grunt replacement it builds everything I need.