Installing Gulp.js

Gulp.js is an open source JavaScript toolkit that is used for front-end tasks such as

• converting SASS/LESS to CSS (browsers cannot read SASS/LESS files and therefore they have to be converted to CSS)
• reloading browsers automatically when files are saved
• optimising CSS,HTML, JavaScript and images
• and many more

To use gulp.js, you have to have Node.js installed on your machine. To install Node.js, follow my tutorial.

When you have Node.js installed on your machine, install Gulp.js by typing the following command into command line and press enter

npm install gulp -g

The

 npm install

command used is a command that uses Node Package Manager (npm) to install Gulp onto your machine.

The

 -g

flag in this command tells npm to install Gulp globally onto your machine. This allows you to use the gulp command anywhere on your system.

Once you press enter, the installation will start. After installation you should see the line saying what version of gulp has been installed (in my case it is gulp 3.9.1) – 

Don’t mind error messages asking to update version of minimatch as there is not much you can do about it. If you want to check what version of minimatch you have installed, type the following command into command line –

npm view minimatch version

If there is lower version than 3.0.2 installed, type the following command into command line –

npm install -g minimatch

Now, there is appropriate version installed, so if you type this command again –

npm view minimatch version

you will get the right version of minimatch –

Gulp.js is successfully installed on your computer and is ready to be used.

Install Node.js and NPM on Windows

Node.js is useful javascript that makes developing websites much simpler. This means that by installing Node.js on your machine, you can quickly convert SASS to CSS, make HTML, JavaScript and graphic files smaller. By installing NPM on your machine, you can add many useful Node modules that will make your development work simpler. To find thousands of free packages to download, visit www.npmjs.com

To be able to work with Node.js, you must be type command line instructions therefore you must be comfortable with using command prompt, git shell etc.
If you are not comfortable with this, don’t worry just give it a go, everybody must start somewhere! I’ll walk you through simple installation process and if you would like to learn more, just follow my blog for more posts.

Download and install

1. Download node.js
2. Run the installer (the file you just downloaded)
3. Follow the instructions (Accept the license agreement, click the NEXT button a few times and accept the default installation settings).
4. This is the success message – 
5. Once it’s installed, you should get this folder structure in Start –
6. After installation, you have to restart computer to be able to use Node.js

Test it!

Test Node

To check if node.js is really working, open Node.js command prompt by clicking on the icon –

Type

node -v

This should give you installed version of Node.js such as v6.11.0 in my case –

There is also message at the top of the command prompt saying ‘Your environment has been set up for using Node.js 6.11.0 (x64) and npm.’ proving that we installed everything successfully.

Test NPM

To check if NPM is installed, type

npm -v

This should give you installed version of NPM such as 3.10.10 in my case –
0

Uninstalling Node.js and NPM

To uninstall Node.js and NPM –

1. Open the Windows Control Panel
2. Click the “Uninstall a program” option in “Programs”
3. Select Node.js, and click the Uninstall link.

Download and install NPM package

Visit www.npmjs.com and find the package you would like to install by typing it to search bar on the top of the website –

Once you choose package you’d like to install, follow the instructions on the page.
(I’ll be using gulp-sass-themes package)

On the page, there are instructions what to do next – type

npm install gulp-sass-themes gulp-sass --save-dev

and press enter. Installation is in the process and all you have to do is wait for the installation to finish.

Once it’s done, you don’t need to do anything as it’s all installed for you.
When installation is running, NPM creates a folder named “node_modules”, where the package will be placed. All installed packages will be placed in this folder.

The project has a folder structure like this:

C:\Users\veronika\node_modules\name-of-the-package