title: Update: Errors with postCSS and Babel in Gulpfile
body: <h1>Goal</h1>
  
  <p>I'm updating my old <code>gulpfile.js</code>, which used to be mainly for compiling my Sass into CSS, but now I'm trying to get Gulp to do the following: </p>
  
  <ol>
  <li>Sync browser, whip up localhost server - <strong>DONE</strong></li>
  <li>Compile Sass => CSS  - <strong>DONE</strong></li>
  <li>Show any JavaScript errors with JSHint - <strong>DONE</strong>
  
  <ul>
  <li>Compile ES6 => ES6 with Babel <code>(WORKING ON)</code></li>
  </ul></li>
  <li>Minify all assets <code>(WORKING ON)</code>
  
  <ul>
  <li>Show project file size - <strong>DONE</strong></li>
  </ul></li>
  <li>Deploy index.html, style.css and images to S3 <code>(WORKING ON)</code></li>
  <li>Watch files, reload browser when <code>.scss</code> or <code>.html</code> changes  - <strong>DONE</strong></li>
  </ol>
  
  <h1>Problem</h1>
  
  <ul>
  <li>Trying to minify my Javascript and also create a <code>scripts.min.js</code>
  file, it keeps adding the suffix min to every new minified JavaScript
  file.</li>
  </ul>
  
  <h2>Folder structure</h2>
  
  <pre><code>index.html
  gulpfile.js
  package.json
  .aws.json
  .csscomb.json
  .gitignore
  
  assets
  - css
  style.css
  style.scss
  
  --partials
  ---base
  ---components
  ---modules
  
  - img
  - js
  scripts.js
  
  - dist
  </code></pre>
  
  <h2>gulpfile.js</h2>
  
  <pre><code>// Include Gulp
  var gulp = require('gulp');
  var postcss = require("gulp-postcss");
  
  // All of your plugins
  var autoprefixer = require('autoprefixer');
  var browserSync = require('browser-sync');
  var cache = require('gulp-cache');
  var concat = require('gulp-concat');
  var csswring = require("csswring");
  var imagemin = require('gulp-imagemin');
  var jshint = require('gulp-jshint');
  var lost = require("lost");
  var plumber = require('gulp-plumber');
  var rename = require('gulp-rename');
  var rucksack = require("rucksack-css");
  var sass = require('gulp-sass');
  var uglify = require('gulp-uglify');
  
  // Sync browser, whip up server
  gulp.task('browser-sync', function() {
    browserSync({
      server: {
         baseDir: "./"
      }
    });
  });
  
  // Reload page automagically
  gulp.task('bs-reload', function () {
    browserSync.reload();
  });
  
  // Compile Sass into CSS, apply postprocessors
  gulp.task('styles', function(){
    var processors = [
        autoprefixer({browsers: ['last 2 version']}),
        csswring,
        lost,
        rucksack
    ];
  
    gulp.src(['assets/css/**/*.scss'])
      .pipe(plumber({
        errorHandler: function (error) {
          console.log(error.message);
          this.emit('end');
      }}))
      .pipe(sass())
      .pipe(postcss(processors))
      // .pipe(gulp.dest('assets/css/'))
      // .pipe(rename({suffix: '.min'}))
      .pipe(gulp.dest('assets/css/'))
      .pipe(browserSync.reload({stream:true}))
  });
  
  // Show any JavaScript errors
  gulp.task('scripts', function(){
    return gulp.src('assets/js/**/*.js')
      .pipe(plumber({
        errorHandler: function (error) {
          console.log(error.message);
          this.emit('end');
      }}))
      .pipe(jshint())
      .pipe(jshint.reporter('default'))
      // .pipe(concat('main.js'))
      // .pipe(babel())
      .pipe(gulp.dest('assets/js/'))
      .pipe(uglify())
      .pipe(gulp.dest('assets/js/'))
      .pipe(rename({suffix: '.min'}))
      .pipe(browserSync.reload({stream:true}))
  });
  
  // Minify assets, create build folder
  gulp.task('images', function(){
    gulp.src('assets/img/**/*')
      .pipe(cache(imagemin({ optimizationLevel: 3, progressive: true, interlaced: true })))
      .pipe(gulp.dest('assets/img'));
  });
  
  // Minify HTML
  
  
  // Default task
  gulp.task('default', ['browser-sync'], function(){
    gulp.watch("assets/css/**/*.scss", ['styles']);
    gulp.watch("assets/js/**/*.js", ['scripts']);
    gulp.watch("*.html", ['bs-reload']);
    gulp.start("images", "styles", "scripts")
  });
  
  // var babel = require('gulp-babel');
  // var minifyhtml = require("gulp-minify-html");
  // var size = require("gulp-size");
  // var upload = require("gulp-s3");
  </code></pre>