javascript - Update: Errors with postCSS and Babel in Gulpfile -

goal

i'm updating old gulpfile.js, used compiling sass css, i'm trying gulp following:

1. sync browser, whip localhost server - done
2. compile sass => css - done
3. show javascript errors jshint - done
   • compile es6 => es6 babel (working on)
4. minify assets (working on)
   • show project file size - done
5. deploy index.html, style.css , images s3 (working on)
6. watch files, reload browser when .scss or .html changes - done

problem

• trying minify javascript , create scripts.min.js file, keeps adding suffix min every new minified javascript file.

folder structure

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 

gulpfile.js

// include gulp var gulp = require('gulp'); var postcss = require("gulp-postcss");  // of 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 server gulp.task('browser-sync', function() {   browsersync({     server: {        basedir: "./"     }   }); });  // reload page automagically gulp.task('bs-reload', function () {   browsersync.reload(); });  // compile sass 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 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"); 

hi can't solve problems had similar issue babel , es6 fat arrow functions (using babelify , browserify). solve problem try pass:

stage: 0 

to babel.js gulp plugin. if error still occurs try pass also:

experimental: true 

for more information please have "experimental" section on babel.js site.