Enter Your Email Address to Watch This Lesson

Your link to unlock this lesson will be sent to this email address.

Unlock this lesson and all 983 of the free egghead.io lessons, plus get JavaScript content delivered directly to your inbox!



Existing egghead members will not see this. Sign in.

Installing and Writing a Default Task with Gulp

1:39 JavaScript lesson by

A brief introduction to using GulpJS in your JavaScript application and creating your first Gulp task.


egghead.io comment guidelines

Avatar
egghead.io

A brief introduction to using GulpJS in your JavaScript application and creating your first Gulp task.

The first thing that we do start using Gulp is install it with NPM install Gulp. That gives us access to the Gulp CLI so we can run the Gulp command.

Once NPM install finishes, we can run the Gulp command and we'll see the error, "No Gulp file found."

First thing we'll do is create the Gulp file. We just call that gulpfile.js. Now that we have that, we'll run the Gulp command again and this time we'll see the error, "No default task in our Gulp file." When you run Gulp, it's going to look for a task called default. That task doesn't exist, it's going to throw this error.

We're going to create a default task. The first thing that we do is declare the Gulp variable. To do that, we just do var gulp = require('gulp').

Now we'll create a Gulp task. That method takes two arguments. The first one is the name of the task, which we will just do default. The second argument is a function where we put all of the work that will be done within that task.

Once we create that Gulp task, we can run Gulp again, and we will see starting default and then finish default. Nothing else is given to us, because right now, our task does not contain any logic.

We'll go ahead and just throw in a console login there with the "Hello, world!" so that we can see how that's printed out in the console. Now that we type that in and we run Gulp again, we'll see that "Hello, world!" is printed out.

There's many things that you can use Gulp to do. For example, you can link your JavaScript files with JSHint, you can precompile your LESS files. You can concatenate files, you can minify and uglify files. All of that logic will be contained within the different Gulp tasks that you create.

HEY, QUICK QUESTION!
Joel's Head
Why are we asking?