title: Gulp - Watch multiple folders and output to relative dist folder
body: <p>I want to use gulp to compile SASS for my custom Wordpress plugins.</p>
  
  <p>All plugin folder share same folder structure: </p>
  
  <p><strong>wp-content/plugins/pluginname</strong></p>
  
  <blockquote>
    <p>assets</p>
    
    <blockquote>
      <p>dist - </p>
      
      <p>src - scss</p>
    </blockquote>
  </blockquote>
  
  <p><strong>GULP TASK</strong></p>
  
  <pre><code>gulp.task('plugin-css', () =&gt; {
        // Main SASS Style Sheet
        const pluginSass = gulp.src(`wp-content/plugins/**/assets/src/*.scss`)
          .pipe(plumber(plumberErrorHandler))
          .pipe(sass());
  
        // Merge the two streams and concatenate their contents into a single file
        return merge(pluginSass)
          .pipe(autoprefixer())
          .pipe(cssmin())
          .pipe(gulp.dest(function(file) {
          return file.base;
        }));
      });
  </code></pre>
  
  <p><em>Currently my compiled css file is being output into the same folder as the src sass. How can I output my compiled sass into 'dist' folder?</em></p>