LearnWebCode/vagrant-lamp

Gulp only refreshes once on PHP file update, not at all on CSS changes

Opened this issue · 6 comments

Working in a WAMP environment (Windows 10, PHP 7.1, Node v8.11.3, Gulp v2.0.1); running the fictional university lesson, section 7; the setup worked fine, but after the automatic reload after a PHP worked only once. Fixed this by added a done(); command after reload:
gulp.watch('./**/*.php', function() { browserSync.reload(); done(); });
See https://stackoverflow.com/questions/29801070/gulp-browser-sync-only-works-once
To fix the CSS I added a semi-colon after the cb() command in the waitforscripts task:
gulp.task('waitForScripts', gulp.series('scripts', function(cb) { browserSync.reload(); cb(); }))

Hello if you are using Local then in your settings file your themeLocation should be like this './wp-content/themes/fictional-university-theme/'
You dont need the /app/ in the front
Happy coding!

@sittingpilgrim I added done() like you suggested. Live reload works, but now I get a reference error in the console:

[14:00:15] Starting '<anonymous>'...
[14:00:15] '<anonymous>' errored after 6.92 ms
[14:00:15] ReferenceError: done is not defined
    at C:\Users\aadil.ayub\Local Sites\fictional-university\gulpfile.js:41:5
    at bound (domain.js:425:14)
    at runBound (domain.js:438:12)
    at asyncRunner (C:\Users\aadil.ayub\Local Sites\fictional-university\node_modules\async-done\index.js:55:18)
    at processTicksAndRejections (internal/process/task_queues.js:79:9)

I figured changing the code to gulp.watch('./**/*.php', function(done) { browserSync.reload(); done(); }); would fix the error, but then the live reload stops working again.

(to be clear, everything works, I just wanted to document this weird behavior here for future readers)

exports.themeLocation = './app/public/wp-content/themes/my theme/';
exports.urlToPreview = 'http://wptest1.local';

Gulp only refreshes once on PHP file update then never work.
please suggest how to fix this issue

gulp --version
CLI version: 2.2.0
Local version: 4.0.2

node --version
v12.14.0

npm --version
6.13.4

My setup is also failing to load CSS. I've applied the changes @sittingpilgrim mentioned

[08:28:26] Starting 'waitForStyles'...
[08:28:26] Starting 'styles'...
Error in plugin "gulp-postcss"
Message:
    Failed to find '../node_modules/@glidejs/glide/dist/css/glide.core.min.css'
  in [
    /Users/aadil/Local Sites/fictional-university/app/public/wp-content/themes/fictional-university-theme/css
  ]
Details:
    fileName: /Users/aadil/Local Sites/fictional-university/app/public/wp-content/themes/fictional-university-theme/css/style.css

Stack:
Error: Failed to find '../node_modules/@glidejs/glide/dist/css/glide.core.min.css'
  in [
    /Users/aadil/Local Sites/fictional-university/app/public/wp-content/themes/fictional-university-theme/css
  ]
    at /Users/aadil/Local Sites/fictional-university/app/node_modules/postcss-import/lib/resolve-id.js:35:13

Here's my settings.js:

exports.themeLocation = './app/public/wp-content/themes/fictional-university-theme/';
exports.urlToPreview = 'http://fictional-university.local';

gulp --version
CLI version: 2.3.0
Local version: 4.0.2

node --version
v12.16.3

npm --version
6.14.4

Working in a WAMP environment (Windows 10, PHP 7.1, Node v8.11.3, Gulp v2.0.1); running the fictional university lesson, section 7; the setup worked fine, but after the automatic reload after a PHP worked only once. Fixed this by added a done(); command after reload:
gulp.watch('./**/*.php', function() { browserSync.reload(); done(); }); -------------------> this one works thanks
See https://stackoverflow.com/questions/29801070/gulp-browser-sync-only-works-once
To fix the CSS I added a semi-colon after the cb() command in the waitforscripts task:
gulp.task('waitForScripts', gulp.series('scripts', function(cb) { browserSync.reload(); cb(); })) -------------------> this one doesn't work

add callback function inside gulp.watch

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

See https://stackoverflow.com/questions/54064808/gulp-watch-only-runs-once