title: Can't get es6 to work with Gulp
body: <p>This is driving me insane, so I'm hoping someone might see something that I'm missing. Thank you for your help in advance.</p>
  
  <p>I have a gulp file and I have installed via npm, babel-core, babel-preset-es2015, babel-preset-react. From researching online and in high hopes even though this might not be right, I have renamed the gulp file to be gulpfile.babel.js and I have created a .babelrc file with </p>
  
  <pre><code>{
    "presets": ["es2015"]
  }
  </code></pre>
  
  <p>I am using browsersync and when I launch the gulp task the html file loads, but the index.js I have includes 'import React....'. This files causing the error in the JS console that says 'Uncaught SyntaxError: Unexpected token import'. </p>
  
  <p>I thought the es2015 npm packages I have should be taking care of that ES6 syntax? </p>
  
  <p>In the gulp file the task that I thought was suppose to take care of that is;</p>
  
  <pre><code>// convert jsx to JS
  gulp.task('babelFiles', function() {
      return gulp.src('js/*.(jsx|js)')
          .pipe(babel({
              compact: false
              }))
          .pipe(gulp.dest('js'))
          .pipe(browserSync.reload({
              stream: true
          }))
  });
  </code></pre>
  
  <p>The gulp task that is responsible for launching this is:</p>
  
  <pre><code>// Default task
  gulp.task('default', ['babelFiles', 'browserSync']);
  </code></pre>
  
  <p>I am puzzled as to what could be wrong here? </p>
  
  <p>Any ideas would be much much appreciated! </p>