title: Can't walk dependency graph
body: <p>My Javascript build process ends up inserting the keyword <code>require()</code> in the file. This is not supported in client side and causes a console error. I have added <code>browserify</code> per other SO answers, however, I am in turn getting another error (below).</p>
  <p>Additional Information:</p>
  <p>I am using:</p>
  <ol>
  <li>Gulp 4</li>
  <li>Node (v14.2.0)</li>
  </ol>
  <p>Error:</p>
  <pre><code>[16:03:55] Using gulpfile /mnt/c/code/mutationObserver/gulpfile.js
  [16:03:55] Starting 'default'...
  [16:03:55] Starting 'clean'...
  [16:03:55] Finished 'clean' after 10 ms
  [16:03:55] Starting 'html'...
  [16:03:55] Starting 'js'...
  [16:03:55] Starting 'css'...
  [16:03:55] Finished 'html' after 46 ms
  [16:03:55] Finished 'css' after 51 ms
  [16:03:55] 'js' errored after 54 ms
  [16:03:55] Error: Can't walk dependency graph: Cannot find module '/mnt/c/code/mutationObserver/src/js/*.js' from '/mnt/c/code/mutationObserver/src/js/_fake.js'
      required by /mnt/c/code/mutationObserver/src/js/_fake.js
      at /mnt/c/code/mutationObserver/node_modules/resolve/lib/async.js:136:35
      at load (/mnt/c/code/mutationObserver/node_modules/resolve/lib/async.js:155:43)
      at onex (/mnt/c/code/mutationObserver/node_modules/resolve/lib/async.js:180:17)
      at /mnt/c/code/mutationObserver/node_modules/resolve/lib/async.js:15:69
      at FSReqCallback.oncomplete (fs.js:175:21)
  [16:03:55] 'default' errored after 69 ms
  </code></pre>
  <p>My entire <code>Gulpfile.js</code> is as follows:</p>
  <pre><code>const { series, parallel, watch, src, dest } = require(&quot;gulp&quot;);
  const plumber = require(&quot;gulp-plumber&quot;);
  const del = require(&quot;del&quot;);
  const concat = require(&quot;gulp-concat&quot;);
  const babel = require(&quot;gulp-babel&quot;);
  const sass = require(&quot;gulp-sass&quot;);
  const browserSync = require(&quot;browser-sync&quot;).create();
  const browserify = require('browserify')
  const source = require('vinyl-source-stream')
  
  
  function html() {
    return src(&quot;./src/*.html&quot;).pipe(dest(&quot;./dist&quot;));
  }
  
  function css() {
    return src(&quot;./src/css/style.scss&quot;)
      .pipe(plumber())
      .pipe(sass().on(&quot;error&quot;, sass.logError))
      .pipe(dest(&quot;./dist/css&quot;));
  }
  
  function js() {
    return browserify(&quot;./src/js/*.js&quot;)
      .bundle()
      .pipe(source(&quot;main.js&quot;))
      .pipe(plumber())
      .pipe(
        babel({
          presets: [&quot;@babel/env&quot;],
          plugins: [&quot;@babel/transform-runtime&quot;],
        })
      )
      .pipe(dest(&quot;./dist/js&quot;));
  }
  
  function clean() {
    return del([&quot;./dist&quot;]);
  }
  
  function watchFor() {
    browserSync.init({
      server: {
        baseDir: &quot;./dist/&quot;,
      },
    });
  
    // first rerun the function that distributed the css files, then reload the browser
    watch(&quot;./src/css/**/*.scss&quot;).on(&quot;change&quot;, css);
    watch(&quot;./dist/css/*.css&quot;).on(&quot;change&quot;, browserSync.reload);
  
    // first rerun the function that distributed the javascript files, then reload the browser
    watch(&quot;./src/js/*.js&quot;).on(&quot;change&quot;, js);
    watch(&quot;./dist/js/*.js&quot;).on(&quot;change&quot;, browserSync.reload);
  
    // first rerun the function that writes to the dist folder, then reload the browser
    watch(&quot;./src/*.html&quot;).on(&quot;change&quot;, html);
    watch(&quot;./dist/*.html&quot;).on(&quot;change&quot;, browserSync.reload);
  }
  
  exports.clean = clean;
  exports.css = css;
  exports.js = js;
  exports.html = html;
  exports.watch = watch;
  exports.default = series(clean, parallel(html, js, css), watchFor);
  
  </code></pre>