ReferencerError: Define is not defined - Browserify
<p>I'm developing a site on React, and I'm trying to generate the <code>bundle</code> with <code>browserify</code> throuhg <code>gulp</code></p>

<p>This is my <code>gulpfile</code>:</p>

<pre><code>var sourcemaps = require('gulp-sourcemaps');
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var browserify = require('browserify');
var watchify = require('watchify');
var reactify = require('reactify');
var babel = require('babelify');
var gulp = require('gulp');
var util = require("gulp-util");
var log = util.log;
var path = require('path');

function compile(watch) {
    var bundler = watchify(browserify('./app.js', { debug: true }));

    function rebundle() {
        bundler.bundle()
            .on('error', function(err) { console.error(err); this.emit('end'); })
            .pipe(source('bundle.js'))
            .pipe(buffer())
            .pipe(sourcemaps.init({ loadMaps: true }))
            .pipe(sourcemaps.write('./'))
            .pipe(gulp.dest('./dist/js'));
    }

    if (watch) {
        bundler.on('update', function() {
            console.log('-&gt; bundling...');
            rebundle();
        });
    }

    rebundle();
}

function watch() {
    return compile(true);
}

gulp.task('build', function() { return compile(); });
gulp.task('watch', ['sass:watch'], function() { return watch(); });

gulp.task('default', ['watch']);
</code></pre>

<p>It correclty runs the build, and generates the <code>bundle</code>. But after that, when I import to the site I get the error:</p>

<blockquote>
  <p>ReferenceError: define is not defined</p>
</blockquote>

<p>I guess <code>browserify</code>, or the <code>bundle</code> generated is expecting some other package that has the define? What I'm missing?</p>

<p>Here is my package.json:</p>

<pre><code>{
  "name": "react-test",
  "version": "0.0.1",
  "license": "",
  "browserify": {
    "transform": [
      "babelify"
    ]
  },
  "dependencies": {
    "react": "^0.14.3",
    "react-dom": "^0.14.3",
    "react-redux": "^4.4.0",
    "redux": "^3.3.1",
    "redux-happy-async": "0.0.4",
    "redux-thunk": "^1.0.3",
    "rest": "^1.3.1"
  },
  "devDependencies": {
    "babel": "^6.5.2",
    "babel-cli": "^6.5.1",
    "babel-core": "^5.8.25",
    "babel-loader": "^5.3.2",
    "babelify": "^6.1.2",
    "browserify": "^13.0.0",
    "gulp": "^3.9.1",
    "gulp-cssnano": "^2.1.1",
    "gulp-sass": "^2.2.0",
    "gulp-sourcemaps": "^1.6.0",
    "gulp-util": "^3.0.7",
    "jasmine": "^2.4.1",
    "jasmine-core": "^2.4.1",
    "karma": "^0.13.21",
    "karma-jasmine": "^0.3.7",
    "karma-phantomjs-launcher": "^1.0.0",
    "karma-webpack": "^1.7.0",
    "phantomjs-prebuilt": "^2.1.4",
    "reactify": "^1.1.1",
    "vinyl-buffer": "^1.0.0",
    "vinyl-source-stream": "^1.1.0",
    "watchify": "^3.7.0",
    "webpack": "^1.12.2",
    "webpack-stream": "^3.1.0"
  }
}
</code></pre>