Changing Laravel's Gulp/Elixir `watch` task

Question

I want to use Laravel's Elixir along with Semantic UI in my new project.

In Semantic UI docs, they suggest how to include their gulp tasks to your current project's gulpfile. In Laravel, they suggest (briefly) how to extend Elixir. But how can I include another gulp task to the watch command?

Currently I'm running gulp watch watch-ui, but I wanted to include the watch-ui task inside watch. Is it possible?

This is my current gulpfile.js:

var gulp     = require('gulp');
var elixir   = require('laravel-elixir');
var semantic = {
  watch: require('./resources/assets/semantic/tasks/watch'),
  build: require('./resources/assets/semantic/tasks/build')
};

gulp.task('watch-ui', semantic.watch);
gulp.task('build-ui', semantic.build);

elixir(function(mix) {
  mix.task('build-ui');
});

Answer 1

If I understand your question correctly, you want to add something to the Semantic UI task. However they never really define a task, but only a function that you can assign to a task.

You can't really include anything in the semantic watch task, unless you want to patch files, but you can add two watch tasks and make sure they both run.

The following code should enable you to do what you need:

var gulp     = require('gulp');
var elixir   = require('laravel-elixir');
var semantic = {
  watch: require('./resources/assets/semantic/tasks/watch'),
  build: require('./resources/assets/semantic/tasks/build')
};

// Define a task for the semantic watch function.
gulp.task('semantic-watch', semantic.watch);

// Define the main watch task, that is depended on the semantic-watch, this will run both watch tasks when you run this one.
gulp.task('watch', ['semantic-watch'], function() {
    // Do your own custom watch logic in here.
});

gulp.task('build-ui', semantic.build);

elixir(function(mix) {
  mix.task('build-ui');
});

You can see how Semantic UI actually defines that their watch tasks should use the watch function here: https://github.com/Semantic-Org/Semantic-UI/blob/master/gulpfile.js#L46