Web front-end development tools--bower Dependency Pack management Tools _javascript Tips

Bower is a package management tool launched by Twitter, which is based on Nodejs's modular thinking, and functions are dispersed into modules, allowing for links between modules and modules, and through Bower to manage this connection between modules.

Package management tools typically have the following features:

A) Registration mechanism: Each package needs to determine a unique ID so that the search and download time can match correctly, so the package management tool needs to maintain registration information, can rely on other platforms.

b) file storage: Determine the location of the file, download the time can be found, of course, this address is accessible on the network.

C Upload Download: This is the main function of the tool, can improve the convenience of package use. For example, want to use jquery only need to install a bit on it, not everywhere to find downloads. Upload is not necessary, depending on the location of the file storage, but the need for a certain mechanism to protect.

d) Dependency Analysis: This is one of the main problems of package management tools, since there is a connection between the packages, then the download will need to deal with their dependencies. When downloading a package, you also need to download the dependent package.

Since Bower is based on NODEJS development, you must first have a NODEJS environment, as for this installation Nodejs a lot of tutorials on the Internet, the use of Bower also need to install Git, here is not much to say.

The benefits of Bower

If you have a project that needs to be used in jquery under normal circumstances we need to go to the jquery official site Download library, so that every time we update jquery, we have to go to the jquery official download, then it would be very troublesome, If a tool can enter a command that allows us to select the version to download, and if you want to update all the libraries in our project to the latest version, you only need to enter a command that is not very convenient, bower another advantage is that if you install bootstrap then it will automatically download jquery, Because Bootstrap relies on jquery, it's easy to say that as long as the library we download relies on another library, Bower will automatically download the libraries that depend on them, bower is so powerful.

Installation of Bower

NPM Install-g Bower represents installation to the global environment

The use of Bower

1. Download Library via Bower

Bower Install (Name of package: jquery) [#版本如: #1.7] Version optional, if not written, default download the latest version

Such as: Bower install bootstrap#2.2

2. If you need to update the library, we can enter the following command

Bower Update

If you need to generate a message that you downloaded a package, such as if you were on a team and you wanted others to know what libraries you were using, and what their version was, then we could do it with the following command.
We need to initialize a description of the package first. It will create a Bower.json directory in your current execution Environment directory

' Bower Init-y '

And then through

' Bower install jquery--save '

It will include jquery version information in the Bower.json file, if you want to add multiple spaces Bower install jquery bootstrap less--save

The following is the contents of the Bower.json file

{
"name": "Down",
"authors": [
"xxxxxxxx"
],
"description": "",
"main": ",
" Moduletype ": [],
" license ":" MIT ",
" homepage ":" ",
" private ": true,
" Ignore ": [
" **/.* ",
"Node_modules",
"bower_components",
"test",
"tests"
],
"dependencies": {
" Bootstrap ":" ^3.3.6 ","
Less ":" ^2.6.1 ",
" jquery ":" ^2.2.2 "
}

Of course, if you are a novice nodejs may be a bit dazed, because this is not a Nodejs basic tutorial, if you want to learn node, you need to study the network.

Bower In addition to these benefits think, there are some more powerful features, it needs to be found, I will not introduce here, after all, I was just beginning to learn node

------------------------------------------------------Split Line---------------------------------------

The relationship between Bower and NPM

Installation bower need to be installed via NPM

The difference between Bower and NPM:

1. In the previous NPM version, it was not able to share the dependent code, and it was said that in the previous NPM version, if you downloaded a bootstrap, because Bootstrap was dependent on jquery, it would also download jquery, But if you have another library that uses jquery, it will also download a jquery, so the code repeats itself.

They are structured like this:

Bootstrap\jquery
Xxxxxxxxx\jquery

They repeat, right, but it seems to have solved the problem in the latest version of NPM.

2. NPM downloads the development environment together, bower only downloads the compiled front module.

3. NPM is mainly used in the internal dependency pack management of the Node.js project, and the installed modules are located in the Node_modules folder under the project root directory. While Bower is used for front-end development in most cases, dependency management for content such as css/js/templates can be customized by the dependent download directory structure. This paragraph is found on the Internet.

The so-called custom directory structure means that the bower you open in that file directory will download the package you need under that file, and NPM doesn't support that.

Summary: We can simply understand that NPM is used to manage the Nodejs module, which is the package, and the bower is used to manage our front-end libraries.

About the Web front-end development tools--bower Dependency Package management tool Small series on the introduction to everyone here, I hope to help you!