Модули ES6 в Gulp - PullRequest
Новая
       61

Модули ES6 в Gulp

0 голосов
/ 06 июня 2018

Я пытаюсь создать шаблон для разработки интерфейса на основе GULP.Как вы можете видеть из кода, я добавил задачу gulp-babel, но, к сожалению, модули ES6 (импорт, экспорт) не работают.Что я должен добавить к своему коду для решения этой проблемы?

Я прочитал, что для этих целей я должен использовать веб-пакет, так что мне следует сделать, чтобы интегрировать GULP с веб-пакетом

Спасибо! 

/*JS For Development*/
        gulp.task('js', function () {
          return gulp.src([
            'app/libs/jquery/dist/jquery.min.js',
            'app/js/common.js',
          ])
              .pipe(concat('scripts.js'))
              .pipe(babel({
                presets: ['env']
              }))
              .pipe(gulp.dest('app/js'))
              .pipe(browserSync.reload({stream: true}));
        });


gulp.task('browser-sync', function () {
  browserSync({
    server: {
      baseDir: 'app'
    },
    notify: false,
    // open: true,
    // tunnel: "gulp-boilerplate"
    // Demonstration page: http://gulp-boilerplate.localtunnel.me
  })
});


/*Styles For Development*/
gulp.task('sass', function () {
  return gulp.src('app/scss/**/*.scss')
      .pipe(sass({outputStyle: 'expanded'}).on("error", notify.onError()))
      .pipe(autoprefixer(['last 15 versions']))
      .pipe(gulp.dest('app/css'))
      .pipe(browserSync.reload({stream: true}));
});        

gulp.task('imagemin', function () {
  return gulp.src('app/img/**/*')
      .pipe(cache(imagemin()))
      .pipe(gulp.dest('dist/img'));
});    

gulp.task('watch', ['sass', 'js', 'browser-sync'], function () {
  gulp.watch('app/scss/**/*.scss', ['sass']);
  gulp.watch(['libs/**/*.js', 'app/js/common.js'], ['js']);
  gulp.watch('app/*.html', browserSync.reload);
});    

gulp.task('build', ['removeDist', 'imagemin'], function () {

  var buildHtml = gulp.src([
    'app/*.html',
    'app/.htaccess',
  ]).pipe(gulp.dest('dist'));

  var buildCss = gulp.src([
    'app/css/main.css'
  ])
      .pipe(cleanCSS())
      .pipe(gulp.dest('dist/css'));

  var buildFonts = gulp.src([
    'app/fonts/**/*'
  ]).pipe(gulp.dest('dist/fonts'));

  var buildJs = gulp.src([
    'app/js/scripts.js',
  ])
      .pipe(uglify())
      .pipe(gulp.dest('dist/js'));

});    

gulp.task('removeDist', function () {
  return del.sync('dist');
});    

gulp.task('clearCache', function () {
  return cache.clearAll();
});   

gulp.task('default', ['watch']);
...