Join egghead, unlock knowledge.

Want more egghead?

This lesson is for members. Join us? Get access to all 3,000+ tutorials + a community with expert developers around the world.

Unlock This Lesson

Already subscribed? Sign In

Autoplay

    Installing and Writing a Default Task with Gulp

    Jacob CarterJacob Carter

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

    gulpGulp
    javascriptJavaScript
    Code

    Code

    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson
    Transcript

    Transcript

    00:00 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.

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

    00:16 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.

    00:37 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').

    00:45 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.

    00:58 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.

    01:10 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.

    01:20 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.

    Discuss

    Discuss