JavaScript relies on Administrative Tools bower

JS Dependency Management Tool Bower Note: This digest is from the author's new book, "Procedural Ape in the cloud era"

2014.9.4

Similar to the previously described Maven, but it is specifically used to manage the JS package, when we develop the application, most of the time the application will use a lot of JS package, such as a project may use jquery, DWR, D3 and other JS package, sometimes may be different version, Wouldn't it be boring if you downloaded it manually and then put it in a local project?

Bower is here to help us do this.

When installing bower, make sure you have installed Nodejs, NPM management tools, and Git.

Install Bower:

npm install -g bower

You can use Bower after installation, very simple, if you need to use jquery, in your project directory, execute:

bower install jquery

When you're done, you'll see an extra bower_components directory under your project directory, as shown below:

bower_components/├──jquery│├──mit-license.txt│├──bower.json│├──dist││├──jquery.js││├       ──jquery.min.js││└──jquery.min.map│└──src│├──ajax││├──jsonp.js││├──load.js│        │├──parsejson.js││├──parsexml.js││├──script.js││├──var│││├──nonce.js│ ││└──rquery.js││└──xhr.js│├──ajax.js│├──attributes  

Okay, so let's introduce jquery in the following way where you're going to use jquery.

<script src="bower_components/jquery/dist/jquery.js"></script>

Of course, this way of quoting is very "Earth", and will introduce you how to not "soil".

We can also define the JS package dependency in a Bower.json configuration file.

Execute under Project directory:

bower init

After you enter information such as the project name, version, author, open source license, and so on, you will see that the system generates a Bower.json configuration file, as follows:

{  "name": "bowerp",  "version": "0.1",  "authors": [    "ChangjunZhao <[email protected]>"  ],  "description": "bower test",  "main": "lib",  "keywords": [    "df"  ],  "license": "MIT",  "private": true,  "ignore": [    "**/.*",    "node_modules",    "bower_components",    "test",    "tests"  ]}

Next, execute:

bower install jquery --save

See Bower.json again:

{" name ":" Bowerp "," Version ":" 0.1 "," authors ": [" Changjunzhao <[email protected]> "]," D    Escription ":" Bower Test "," main ":" Lib "," keywords ": [" DF "]," license ":" MIT "," private ": true," ignore ": [ "**/.*", "Node_modules", "bower_components", "Test", "tests"], "dependencies": {"jquery": "~2.1.1"}} 

The dependency information for jquery was written to the Bower.json file.

At this point, when your project is submitted to the version management tool, the bower_components in this directory will not need to be submitted, just submit the Bower.json. When other developers get the code, they only need to execute commands in the project directory bower install , and all of the JS that the project relies on will be downloaded automatically.

What do you think? Is it convenient?

Other commands and use of bower Method can be used bower help command view. We suggest that no matter what you learn, start from the official website: http://bower.io/. There is not much to say, do it yourself!

Cjzhaomacbook:testproject changjunzhao$ Bower Helpusage:bower <command> [<args>] [<options>]    Commands:cache Manage Bower Cache help Display help information about Bower Home Opens a package homepage into your favorite browser info info of a particul AR Package init interactively create a Bower.json file install install a                  Locally link Symlink A package folder List List Local Packages lookup                Look up a package URL by name Prune removes local extraneous packages register Register A package Search search for a package by name update Update a loc    Al Package Uninstall Remove a local package version Bump a package versionoptions: -F,--force makes VArious commands more forceful-j,--json Output consumable json-l,--log-level what level of lo GS to Report-o,--offline does not hits the network-q,--quiet only output important informatio    N-S,--silent do not output anything, besides errors-v,--verbose makes output more verbose --allow-root allows running commands as root--version Output Bower version

JavaScript relies on Administrative tools bower