Gulp 3 => Gulp 4 проблемы - PullRequest
Новая
       16

Gulp 3 => Gulp 4 проблемы

0 голосов
/ 07 мая 2019

Я преобразовал Gulpfile в Gulp 4, но у меня возникли проблемы с ним.

Когда я запускаю gulp, он работает нормально, компилирует стили и загружает их, но затем говорит "Соединение закрыто" и ничего не делает, когда я изменяю файл.

У кого-нибудь есть идеи, как заставить его продолжать просматривать файлы и перезапускать компиляцию? 

(() => {

  'use strict';

  const gulp         = require('gulp');
  const sass         = require('gulp-sass');
  const sourcemaps   = require('gulp-sourcemaps');
  const concat       = require('gulp-concat');
  const autoprefixer = require('gulp-autoprefixer');
  const plumber      = require('gulp-plumber');
  const gutil        = require('gulp-util');
  const sftp         = require('gulp-sftp');
  const path         = require('path');
  const notify       = require('gulp-notify');
  const uglify       = require('gulp-uglify');
  const rename       = require('gulp-rename');



  gulp.task('sass2css', () => {
    return (
      gulp
        .src('src/sass/**/*.{scss,sass}')
        .pipe(plumber({
          errorHandler: function (err) {
            console.log(err);
            this.emit('end');
          }
        }))
        .pipe(sourcemaps.init())
        .pipe(sass({
          indentedSyntax: false,
          outputStyle: 'nested'
        }))
        // .pipe(concat('application.css'))
        .pipe(autoprefixer({
          browsers: ['last 3 versions']
        }))
        .pipe(gulp.dest('dist/styles'))
    )
  })



  gulp.task('deployCSS', () => {
    return gulp.src('dist/styles/*.css')
    .pipe(sftp({
      host: 'xxxxxxxxx',
      auth: 'xxxxxxx',
      remotePath: 'xxxxx/xxxxx/xxxxx/assets/css'
    }));
  })


  // gulp.task('watch', function() {
  //   gulp.watch('src/sass/**/*.{scss,sass}', gulp.series('sass'));
  //   gulp.watch('dist/styles/**/*.css', gulp.series('deployCSS'));
  // })


  // gulp.task('default', gulp.parallel('sass', 'watch'));


  gulp.task('watch', (done) => {
    gulp.watch('src/sass/**/*.{scss,sass}', gulp.series('sass2css'));
    gulp.watch('dist/styles/**/*.css', gulp.series('deployCSS'));
    done();
  })



  exports.default = gulp.series('sass2css', 'deployCSS', 'watch');


  function errorHandler (error) {
    console.log(error.toString());
    this.emit('end');
  }

})();

Вот так выглядит мой терминал при однократном запуске: 

[vagrant@precise64] ➜  myproject git:(master) ✗ gulp
[09:07:59] Using gulpfile /vagrant/myproject/gulpfile.js
[09:07:59] Starting 'default'...
[09:07:59] Starting 'sass2css'...
[09:08:02] Finished 'sass2css' after 2.89 s
[09:08:02] Starting 'deployCSS'...
[09:08:02] Authenticating with password.
[09:08:06] gulp-sftp: Uploaded: application.css => xxxxx/xxxxx/xxxxx/assets/css/application.css
[09:08:06] gulp-sftp: 1 file uploaded successfully
[09:08:06] Finished 'deployCSS' after 3.28 s
[09:08:06] Starting 'watch'...
[09:08:06] Finished 'watch' after 34 ms
[09:08:06] Finished 'default' after 6.22 s
[09:08:06] SFTP :: SFTP session closed
[09:08:06] Connection :: end
[09:08:06] Connection :: closed

1 Ответ

0 голосов
/ 16 июля 2019

gulp.series () возвращает функцию, поэтому вам нужно добавить () после ваших вызовов.Попробуйте: 

  gulp.task('watch', (done) => {

    gulp.watch('src/sass/**/*.{scss,sass}').on('change', function (){ 
        gulp.series('sass2css')(); 
    });

    gulp.watch('dist/styles/**/*.css').on('change', function (){
        gulp.series('deployCSS')(); 
    });

    done();

  });
...