title: How to expose 'require' to the browser when using browserify from within gulp?
body: <p>When I have a file x.js that looks like this:</p>
  
  <p>x.js</p>
  
  <pre><code>module.exports = function (n) { return n * 111 }
  </code></pre>
  
  <p>and I run browserify from the command line like so:</p>
  
  <pre><code>browserify -r ./x.js &gt; bundle.js
  </code></pre>
  
  <p>I get an output file that looks like this (roughly): </p>
  
  <pre><code>require=(function e(t,n,r){function ......
  ./App.jsx":[function(require,module,exports){
  module.exports=require('0+DPR/');
  },{}]},{},[])
  </code></pre>
  
  <p>Then in my browser code I can do this:</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
      &lt;title&gt;React server rendering example&lt;/title&gt;
      &lt;script src="static/bundle.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      Welcome to the React server rendering example. Here is a server-rendered React component:
      &lt;div id="53a442ff8b39d"&gt;&lt;/div&gt;&lt;script&gt;
      var x = require('./x.js');
      console.log(x(3))
  &lt;/script&gt;  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I actually have two questions:</p>
  
  <p>1) This doesn't quite work in the browser I get the error: "Uncaught Error: Cannot find module './x.js'". Why is that happening?</p>
  
  <p>2) I actually want to run this in gulp using vinyl-source-stream. I've tried doing something like this in my gulpfile but it doesn't work. Any ideas? I get the error 'require is not defined'</p>
  
  <pre><code>var   gulp = require('gulp'),
    browserify = require('browserify'),
    source = require('vinyl-source-stream');
  
  var b = browserify({
      entries: ['./x.js'],
    });
     b.bundle({debug: false})
     .pipe(source('bundle.js'))
     .pipe(gulp.dest('./build'));
  </code></pre>