How to Install and Set Up Bower On Windows 10

Themomsco [CPS] IN

In this tutorial, we will learn how to install bower on windows 10. But, before installing it on your machine, you should know about it?

What is Bower?

Bower is a package manager for the web. With the help of it, you can fetch and install packages from all over. It can also take care of finding, downloading, and saving the packages and other stuff that you are looking for. Let’s understand how to put all things together by install bower on Windows.

Follow the steps to install on your window machine.

Step 1: Install Git

To install bower you need git, So if you do not have git, try installing it on your machine. Please find the link here Git for windows.

Just click on the link and download git for your window computer 32bit or 64bit and follow the installation process carefully.

To check git on your computer, simply open the command prompt and run:

git --version

Press enter and you will see the following screen (version may be different)

Bower - Check Git Version

Step2: Install Node.js and NPM

Bower is dependent on Node.js, so you will have to install node.js. We have already covered how to install node.js on windows.

To check Node.js & NPM on your computer, simply open the command prompt and run:

node --version

npm --version

//OR

node --version && npm --version

Press enter and you will see the following screen (versions may be different)

Node.js and NPM version

Now, we assume that you have git and node.js installed on your Windows 10 computer. Let’s go ahead and install it.

You might need to restart the computer so that all the dependency like git and NPM set up well to find the path variables.

Step3: Install Bower

Open the command prompt and run the following command:

npm install -g bower

Please note that we have used -g flag, it tells NPM to install bower globally on your machine.  By doing that you don’t need to install it for every project. It will be available every time while creating a new project.

Check the bower version by issuing the following command:

bower --version

Once you have installed then you can install packages and dependencies using these commands:

// Using a local or remote package name
bower install <package_name>
 
// Using a specific version of a package name
bower install <package_name>#<version_number>
 
// Search packages by package name
bower search <package_name>

In a project, packages are kept in the bower_components directory which can be changed if you think.

You can also change the package downloads folder by creating a .bowerrc file within your project folder.

.bowerrc file:

{
    "directory": "js/libs" // change this folder destination as per your preference
}

You can also create a bower.json file and define multiple packages name with or without version.

{
    "name": "MyFirstApp",
    "version": "1.0",
    "dependencies": {
          "core-js": "^2.5.4",
          "rxjs": "^6.0.0",
          "underscore": "~1.5.0",
          "backbone": "~1.1.2",
    }
}

Navigate to your project folder directory and run the command “bower install”.

It will download and install all the packages in your bower_components folder.

Finally, Install Bower on windows 10 tutorial is completed.

Themomsco [CPS] IN

Leave a Reply