How to Install Gulp.js on Ubuntu

Gulp is an open-source JavaScript software toolkit that helps you to automate painful or time-consuming tasks in your development workflow. It is cross-platform and can be integrated into all major IDEs. You can use Gulp with many programming languages including PHP, .NET, Node.js, Java, and more.

In this post, we will explain how to install Gulp js on Ubuntu 20.04 VPS.

Step 1 – Install Required Dependencies

Before starting, you will need to install some dependencies on your server. You can install all of them with the following command:

apt-get install python3-software-properties gnupg2 curl wget -y

Once all the dependencies are installed, you can proceed to install Node.js.

Step 2 – Install Nodejs

You will also need to install Node.js before installing Gulp.js. Now, install the Node.js with the following command:

apt-get install nodejs -y

Once Node.js is installed, verify the installed version of Node.js with the following command:

node --version

Output:

v14.17.0

You can also verify the NPM version with the following command:

npm --version

Output:

6.14.13

Step 3 – Create a Sample Application with NPM

First, create a new application directory with the following command:

mkdir project

Next, change the directory to the project directory and create an application with the following command:

cd project
npm init

You will be asked some questions to create a package.json file:

This utility will walk you through creating a package.json file.
It only covers the most common items, and tries to guess sensible defaults.

See `npm help init` for definitive documentation on these fields
and exactly what they do.

Use `npm install ` afterwards to install a package and
save it as a dependency in the package.json file.

Press ^C at any time to quit.
package name: (project) 
version: (1.0.0) 
description: My Gulp Project
entry point: (index.js) 
test command: "echo "How Are You" && exit 1"
git repository: 
keywords: 
author: Admin
license: (ISC) 
About to write to /root/project/package.json:

{
  "name": "project",
  "version": "1.0.0",
  "description": "My Gulp Project",
  "main": "index.js",
  "scripts": {
    "test": "\"echo \"How Are You\" && exit 1\""
  },
  "author": "Admin",
  "license": "ISC"
}


Is this OK? (yes) Yes

Step 4 – Install Gulpjs

Next, you can install the Gulp CLI tool with the following command:

npm install -g gulp-cli

Output:

/usr/bin/gulp -> /usr/lib/node_modules/gulp-cli/bin/gulp.js
+ [email protected]
added 252 packages from 165 contributors in 17.941s

Once Gulp is installed, change the directory to your project directory and install the gulp package with the following command:

cd /root/project
npm install --save-dev gulp

You can now verify the Gulp version with the following command:

gulp --version

You should see the following output:

CLI version: 2.3.0
Local version: 4.0.2

Step 5 – Create a Gulp Application

Next, create a sample Gulp application with the following command:

nano /root/project/gulpfile.js

Add the following lines:

var gulp = require('gulp');

gulp.task('hello', function(done) {
  console.log('Hello World!!!');
  done();
});

Save and close the file, then run the gulp task with the following command:

gulp hello

If everything is fine, you should get the following output:

[09:11:28] Using gulpfile ~/project/gulpfile.js
[09:11:28] Starting 'hello'...
Hello World!!!
[09:11:28] Finished 'hello' after 4.41 ms

Conclusion

Congratulations! You have successfully installed Gulp on Ubuntu 20.04 VPS. You can now create your own application with Gulp. For more information, visit the Gulp documentation.