Install bower component via git repo

If you haven't dabbeled in bower yet, bower coupled with node.js is similar to maven. It helps manage front end development dependencies such as css, js and other components. Similar to maven pointing to nexus, bower allows you to point to internal or external registry. Having this flexibility comes in handy when you want to publish internal components for consumption. An alternative to setting up an internal bower registry is to install from a git repository hosted in a source code manager such as github, bitbucket or atlassian stash. The following examples are some notes I took while using twitter bootstrap github repo and installing using a git endpoint, a tag, commit hash or branch name.

Set up

Verify you have your environment setup by following the steps below:

  • install nodejs
  • in command line run npm install -g bower to install bower
  • bower init -> will build your bower.json file

Proxy

Having troubles connecting to the external bower registry? It quite possible you might be running into proxy issues, which many of us in corporate world do, be sure to set the following environment variables:

Stash public access

If you working with a stash repo, you will need to make sure that you mark the repo as public. Under project -> repo -> permission -> repository -> Public Access needs to be selected. This allow users or in our case bower to access Stash without an account.

Bower install with git end points

The general format to install from an end point is <package>#<sha>. In each of the snippets below we will modify the bower.json and run bower update in the command line.

Default end point

...
"dependencies": {
    "bootstrap": "https://github.com/twbs/bootstrap.git"
},
...
Default endpoint

Tag

...
"dependencies": {
    "bootstrap": "https://github.com/twbs/bootstrap.git#v3.0.0"
},
...
Default endpoint

Commit hash

...
"dependencies": {
    "bootstrap": "https://github.com/twbs/bootstrap.git#b67a4ec28b9cb0f16cd88f34491284dd15826d33"
},
...
Default endpoint

Named branch

...
"dependencies": {
    "bootstrap": "https://github.com/twbs/bootstrap.git#clean_super_clean"
},
...
Default endpoint

Summary

There are several ways to install bower components from git hub end points. Be sure to check bower documentation for full details including ways to install via the command line.