How to install and use the Bower package dependency tool

What is Bower

Bower is a client-side technology Package Manager that can be used to search, install, and uninstall network resources such as JavaScript, HTML, and CSS. Other development tools based on bower, such as Yeoman and Grunt, are described in a later article.

Preparatory work

1. Installation node Environment: node. js
2. Install Git , Bower get a code package from a remote git repository: git easy guide

Installing Bower

Using NPM, open the terminal and enter:

npm install -g bower

Where the -g command indicates a global installation

Start using

Use help commands to view Help

Install directory for custom packages

First enter the project directory, create a new file1.txt

Then the command line enters the project directory and the input command renames the file as .bowerrc :

rename 1.txt .bowerrc

This .bowerrc file is a bower directory of custom downloaded code packages, such as my project structure now:

The contents of my .bowerrc file are as follows:

{  "directory" : "js/lib"}

Bower Initialization

command line into the project directory, enter the following command:

bower init

You will be prompted to enter some basic information, depending on the prompt to press ENTER or a space, and then generate a bower.json file to save the configuration of the project, as follows:

{  "Name ":"Bb_boot", "version ": " 0.0.1 ","Authors ": [ " Savokiss <[email protected]> "],"moduletype ": [  "AMD"], "license": "MIT", "Ignore": [ "**/.*", "Node_modules", "bower_components", c17> "Js/lib", "test", " tests"], "dependencies": {}}       

Installation of the package

The following finally started to install the required package!
For example, I want to install one jquery , enter the following command:

install jquery --save

Then bower you'll download the latest version from the remote jquery to your js/lib directory
One --save of the parameters is to save the configuration to your bower.json , and you will find that the bower.json file is already one more line:

  "dependencies": {    "jquery": "~2.1.4"  }

Information about the package

For example, if we want to find out jquery which versions are available, enter the following command:

bower info jquery

will see jquery the bower.json information, and the available version information

You can see jquery the latest version of the compatibility version for1.11.3

Update for packages

This is the latest version of the above installation jquery , if you want to be compatible with the lower version of the browser?
The version jquery number in the file modified below has been checked for compatibility with the lower version of the browser 1.11.3 , as bower.json jquery follows:

  "dependencies": {    "jquery": "~1.11.3"  }

Then execute the following command:

update

bowerI'll switch jquery the version for you.

Package Lookup

There is also a very important function, that is, package search, such as I want to install bootstrap a plug-in, but can not remember the name, it is directly on the command line input:

bower search bootstrap

bowerThe bootstrap available packages that contain the string are listed.

Uninstallation of the package

The Unload package can use the uninstall command:

uninstall jquery

 

How to install and use the Bower package dependency tool