title: How to solve gulp image copy issue on build?
body: <p><strong>Problem</strong> - copied images end up with size <code>0 x 0 px</code>.</p>
  
  <p>In my <code>gulpfile.js</code> I copy images from the <code>app</code> directory to the <code>dist</code> directory, which works well. Here's a simplified version of the task:</p>
  
  <pre><code>gulp.task('html-deploy', function() {
      return gulp.src([
          'app/img/**/*',
          'app/**/*.html'
          ],
          {
              base: 'app'
          }
      )
      .pipe(gulp.dest('dist'))
  });
  </code></pre>
  
  <p>My file structure looks like this:</p>
  
  <pre><code>/app
      index.html
      /img
          image1.png
          image2.png
  </code></pre>
  
  <p>Everything copies over well and nice, however the images don't display in the browser, even though filepaths are correct. </p>
  
  <p>The weird thing is when I locate the images directly in Finder (osx) I can't view them there either, although the filesizes and read/write values are correct too. </p>
  
  <p>This is probably because the copied images end up being 0x0 px in size. Why is this happening?</p>