часы глотка бегут только один раз - PullRequest
0 голосов
/ 06 января 2019

Gulp watch запускается только один раз при первом изменении. Я запускаю Wordpress на apache2 на Ubuntu 14 и использую учебник. Он показывает, как использовать gulp для отслеживания изменений. Это работает нормально для первого изменения - обновляет браузер, который http://localhost:3000. Я довольно плохо знаком с настройкой gulp watch, поэтому я не понимаю, почему он запускается только один раз. Gulpfile.js выглядит следующим образом. Если кому-то нужно что-то уточнить, пожалуйста, вернитесь. Спасибо

Я сделал кодовую версию выключения и повторного включения. Я просматривал различные ответы на этот тип проблемы в стеке потока и других местах.

var gulp = require('gulp'),
   settings = require('./settings'),
   webpack = require('webpack'),
   browserSync = require('browser-sync').create(),
   postcss = require('gulp-postcss'),
   rgba = require('postcss-hexrgba'),
   autoprefixer = require('autoprefixer'),
   cssvars = require('postcss-simple-vars'),
   nested = require('postcss-nested'),
   cssImport = require('postcss-import'),
   mixins = require('postcss-mixins'),
   colorFunctions = require('postcss-color-function');

gulp.task('styles', function() {
  return gulp.src(settings.themeLocation + 'css/style.css')
    .pipe(postcss([cssImport, mixins, cssvars, nested, rgba, colorFunctions, autoprefixer]))
    .on('error', (error) => console.log(error.toString()))
    .pipe(gulp.dest(settings.themeLocation));
});

gulp.task('scripts', function(callback) {
  webpack(require('./webpack.config.js'), function(err, stats) {
    if (err) {
      console.log(err.toString());
    }

    console.log(stats.toString());
    callback();
  });
});

gulp.task('watch', function() {
 browserSync.init({
    notify: false,
    proxy: settings.urlToPreview,
    ghostMode: false
  });

  gulp.watch('./**/*.php', function() {
    browserSync.reload();
  });

  gulp.watch(settings.themeLocation + 'css/**/*.css', gulp.parallel('waitForStyles'));

  gulp.watch([settings.themeLocation + 'js/modules/*.js', settings.themeLocation + 'js/scripts.js'], 
       gulp.parallel('waitForScripts'));
});

gulp.task('waitForStyles', gulp.series('styles', function() {
  return gulp.src(settings.themeLocation + 'style.css')
    .pipe(browserSync.stream());
}))

gulp.task('waitForScripts', gulp.series('scripts', function(cb) {
  browserSync.reload();
  cb()
}))

Я ожидаю, что представление и функциональность браузера будут обновляться при каждом изменении кода. Это происходит только один раз после запуска gulp с 'gulp watch'.

Ответы [ 2 ]

0 голосов
/ 05 июня 2019

В соответствии с правилами для stackoverflow моя репутация слишком низкая, чтобы сказать вам, что ответ Марка сработал для меня под комментариями к его ответу, поэтому я добавлю его здесь. Мы добавили глоток в курс Udemy, который я беру, и это стало камнем преткновения для многих пользователей на этом сайте.

Кто-то должен будет пометить его как правильный ответ. Вероятно, gulp.js следует изменить, чтобы учесть этот вариант использования, но я использую его впервые. Спасибо Марк.

0 голосов
/ 09 января 2019

Задание gulp, которое запускается только один раз, обычно указывает на то, что gulp не может определить, что оно завершилось в первый раз, и поэтому gulp не будет запускать его снова.

Изменить на этот код:

// notice the "done" added below
gulp.task('watch', function(done) {
 browserSync.init({
    notify: false,
    proxy: settings.urlToPreview,
    ghostMode: false
  });

  //  I also added a callback function below, just within this one gulp.watch
  gulp.watch('./**/*.php', function(done) {
    browserSync.reload();
    done();
  });

  gulp.watch(settings.themeLocation + 'css/**/*.css', gulp.parallel('waitForStyles'));
  gulp.watch([settings.themeLocation + 'js/modules/*.js', settings.themeLocation + 'js/scripts.js'], 
             gulp.parallel('waitForScripts'));
  done();
});

Я также видел это предложил использовать эту форму заявления о наблюдении:

gulp.watch('src/pages/**/*.html').on('change',gulp.series(pages, browser.reload));

вместо обычно используемых:

gulp.watch('src/pages/**/*.html', gulp.series(pages, browserSync.reload));

Поэтому, если решение для обратного вызова не работает, попробуйте использовать предложенную форму watch.

...