GulpJS - live reload with Laravel

Question

I'm trying to get this working and I have spent a day now with not much success... I'm new to both Laravel and GulpJS, which makes it even better I guess... :)

What I'm trying to achieve is a (preferably cross-platform) solution for reloading the browser on file changes using GulpJS on a Laravel instance. I could get gulp-livereload working as per its documentation, but I cannot set it up properly to have an effect on the local domain http://laravel.dev set with MAMP PRO (I know, I know...).

I am happy to leave MAMP behind if it's a must as long as I can set a local development domain on a project-by-project basis. I tried to look around even on https://laracasts.com/ but I'm yet to find a solution which would take care of automatic reloading of the browser with Laravel - it seems this bit is missing from all Laravel-GulpJS solutions...

Anybody for the rescue? Any ideas? I'll keep looking in the meantime... :)

Hey! Did you solve your problem? I'm not sure if I understand your approach. Could you define "proper effect on the local domain"? Did you mind to do separate watches/refreshes for each domain? — Namek, Nov 08 '14 at 00:03
@Namek - I didn't solve the problem. I just set up a quite nice workflow for myself using Gulp and including live browser reload when I stumbled upon Laravel. Now, hence Laravel operates on it's own server - the built in one or through a VM - the live reload is no longer an option as that only works with it's own server. Now, I found that it may be possible to set up an observer to watch the live reload trigger then proxy it through to have an affect on the server running Laravel. I'm not sure it is at all possible - and I didn't succeed. But with Laravel 5 and Elixir around the corner... :) — Barnabas Kecskes, Nov 10 '14 at 22:09

score 0 · Answer 1 · answered Jul 21 '15 at 14:50

Of course, you can use gulp-livereload with Laravel. And you don’t have to use Elixir for livereload. Just do the following:

Install gulp modules as usual in your Laravel App folder:
```
npm install --save-dev gulp gulp-livereload
```
Add javascript to Laravel layout script for livereload with src="//localhost:35729/livereload.js?snipver=1" (sorry, this site doesn't allow me to insert complete javascript snippet)
Install LiveReload browser extension

The simplest gulpfile.js will be like this:

var gulp = require('gulp'),
    livereload = require('gulp-livereload');

gulp.task('reload', function() {
    livereload.reload();
});

gulp.task('watch', function() {
  livereload.listen();
  gulp.watch(['./public/**/*.css', './app/**/*.php', './resources/**/*.php'],
    ['reload']);
});

run gulp watch

GulpJS - live reload with Laravel

1 Answers1