Installing a dependency with Bower from URL and specify version - bower

I am trying to install a dependency with Bower using a URL. As of Bower documentation:
Bower offers several ways to install packages:
# Using the dependencies listed in the current directory's bower.json
bower install
# Using a local or remote package
bower install <package>
# Using a specific version of a package
bower install <package>#<version>
# Using a different name and a specific version of a package
bower install <name>=<package>#<version>
Where <package> can be any one of the following:
A name that maps to a package registered with Bower, e.g, jquery.
A remote Git endpoint, e.g., git://github.com/someone/some-package.git.
Can be public or private.
A local endpoint, i.e., a folder that's a Git repository.
A shorthand endpoint, e.g., someone/some-package
(defaults to GitHub).
A URL to a file, including zip and tar files.
Its contents will be extracted.
However, then it says, that all the types except the URL allow to specify a version.
How do I specify a version for a URL downloaded dependency?

Use a git endpoint instead of a package name:
bower install https://github.com/jquery/jquery.git#2.0.3

If you use bower.json file to specify your dependencies:
{
"dependencies": {
...
"photo-swipe": "git#github.com:dimsemenov/PhotoSwipe.git#v3.0.x",
#bower 1.4 (tested with that version) can read repositorios with uri format
"photo-swipe": "git://github.com/dimsemenov/PhotoSwipe.git#v3.0.x",
}
}
Just remember bower also searches for released versions and tags so you can point to almost everything, and can interprate basic query patterns like previous example. that will fetch latest minor update of version 3.0 (tested from bower 1.3.5)
Update, as the question description also mention using only a URL and no mention of a github repository.
Another example is to execute this command using the desired url, like:
bower install gmap3MarkerWithLabel=http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerwithlabel/1.0/src/markerwithlabel.js -S
that command downloads your js library puts in {your destination path}/gmap3MarkerWithLabel/index.js and automatically creates an entry in your bower.json file called gmap3MarkerWithLabel: "..." After that, you can only execute bower update gmap3MarkerWithLabel if needed.
Funny thing if you do the process backwars (add manually the entry in bower.json, an then bower install entryName) it doesn't work, you get a
bower ENOTFOUND Package
gmapV3MarkerWithLabel not found

Targeting a specific commit
Remote (github)
When using github, note that you can also target a specific commit (for example, of a fork you've made and updated) by appending its commit hash to the end of its clone url. For example:
"dependencies": {
"example": "https://github.com/owner_name/repo_name.git#9203e6166b343d7d8b3bb638775b41fe5de3524c"
}
Locally (filesystem)
Or you can target a git commit in your local file system if you use your project's .git directory, like so (on Windows; note the forward slashes):
"dependencies": {
"example": "file://C:/Projects/my-project/.git#9203e6166b343d7d8b3bb638775b41fe5de3524c"
}
This is one way of testing library code you've committed locally but not yet pushed to the repo.

Use the following:
bower install --save git://github.com/USER/REPOS_NAME.git
More here:
http://bower.io/#getting-started

Just an update.
Now if it's a github repository then using just a github shorthand is enough if you do not mind the version of course.
GitHub shorthand
$ bower install desandro/masonry

Here's a handy short-hand way to install a specific tag or commit from GitHub via bower.json.
{
"dependencies": {
"your-library-name": "<GITHUB-USERNAME>/<REPOSITORY-NAME>#<TAG-OR-COMMIT>"
}
}
For example:
{
"dependencies": {
"custom-jquery": "jquery/jquery#2.0.3"
}
}

Just specifying the uri endpoint worked for me, bower 1.3.9
"dependencies": {
"jquery.cookie": "latest",
"everestjs": "http://www.everestjs.net/static/st.v2.js"
}
Running bower install, I received following output:
bower new version for http://www.everestjs.net/static/st.v2.js#*
bower resolve http://www.everestjs.net/static/st.v2.js#*
bower download http://www.everestjs.net/static/st.v2.js
You could also try updating bower
npm update -g bower
According to documentation: the following types of urls are supported:
http://example.com/script.js
http://example.com/style.css
http://example.com/package.zip (contents will be extracted)
http://example.com/package.tar (contents will be extracted)

I believe that specifying version works only for git-endpoints. And not for folder/zip ones. As when you point bower to a js-file/folder/zip you already specified package and version (except for js indeed). Because a package has bower.json with version in it.
Specifying a version in 'bower install' makes sense when you're pointing bower to a repository which can have many versions of a package. It can be only git I think.

Try bower install git://github.com/urin/jquery.balloon.js.git#1.0.3 --save where 1.0.3 is the tag number which you can get by reading tag under releases. Also for URL replace by git:// in order for system to connect.

Installs package from git and save to your bower.json dependency block.
bower register package-name git-endpoint#version
install package-name --save
(--save will save the package name version in the bower.json file inside the dependency block).
Reference

Related

How to specify a particular provider of a bower dependency

I want to use angular-cookies from bower but when I do:
bower install angular-cookies it sometimes fetches the one published by the angular team and sometimes some other old incompatible one from an independent author (angularify)
If I do manage to get the official one, then whenever I run bower install ... again, for some other reason, bower will switch the version of angular-cookies that I already have, breaking my application.
How can I do something like:
bower install --force https://github.com/angular/bower-angular-cookies
As the doc specifies - you can add something like:
"dependencies": {
"angular-cookies": "git://github.com/angular/bower-angular-cookies"
}
Which will cause bower to get the dependency from the git repo you want. You can also use git://github.com/angular/bower-angular-cookies#branch_name or git://github.com/angular/bower-angular-cookies#tag_name to specify a specific branch or tag.
See this question as well.

Bower install from URL gives blank folder

I'm using bower (v. 1.3.5) to pull in my Front-End JS dependencies, and I want to depend on this: https://github.com/dcneiner/Downloadify
It doesn't have its own bower.json so I'm referencing by URL in MY bower.json:
"dependencies": {
"jspdf": "~1.0.272",
"downloadify": "https://github.com/dcneiner/Downloadify.git"
}
But all I get is the named folder containing only a .bower.json file, but none of the code or anything else in the GH repo.
Running bower install directly on the cmd line gave (once I'd cleared out the bower cache):
E:/My/Path>bower install https://github.com/dcneiner/Downloadify.git
bower Downloadify#* not-cached https://github.com/dcneiner/Downloadify.git#*
bower Downloadify#* resolve https://github.com/dcneiner/Downloadify.git#*
bower Downloadify#* checkout 0.2.1
bower Downloadify#* resolved https://github.com/dcneiner/Downloadify.git#0.2.1
bower Downloadify#~0.2.1 install Downloadify#0.2.1
I previously did the same thing with jQuery.fileDownload which worked perfectly, so I don't think it's anything I've done to my machine?
QUESTION:
Have I done something wrong?
Has Downloadify been set up wrong?
Or is it an inexplicable mystery?
In either of the first 2 cases, what is the problem and how do I fix it?
NOTE: Currently I'm working around it by having downloaded the source code manually and having it hard-coded into my project.

Is Bower only about automatically installing dependencies?

Does Bower actually do anything else than resolve dependecies? I'm trying hard to understand how it is meant to be used, but I guess I'm missing some points...
Say, I have Bower package A, which depends on Bower package B. In my application I'm just interested in package A, since that's what I'm going to use. Of course, that means that somehow both packages must be loaded into the Browser, so that package A can work.
Using Bower I can just do bower install a and will then find both packages A & B in my bower_components. So far, awesome.
But now? Am I forced to find out myself (manually) which files from A and B need to be loaded in my HTML page? I don't think that the full bower_components directly shall be accessible via web, so I have to configure myself manually my Grunt (or whatever) build-file to copy the relevant files?
What am I missing here? If what I wrote above is true, what's the point using Bower when I still need to be aware of all implicit dependencies?
Bower manages dependencies, and it will add the correct files into your HTML if you use it with the --save (or -S) flag. You would need appPath set in your bower.json if your index.html isn't in the same directory.
$ bower help install
Usage:
bower install [<options>]
bower install <endpoint> [<endpoint> ..] [<options>]
Options:
-F, --force-latest Force latest version on conflict
-h, --help Show this help message
-p, --production Do not install project devDependencies
-S, --save Save installed packages into the project's bower.json dependencies
-D, --save-dev Save installed packages into the project's bower.json devDependencies
Additionally all global options listed in 'bower help' are available
Description:
Installs the project dependencies or a specific set of endpoints.
Endpoints can have multiple forms:
- <source>
- <source>#<target>
- <name>=<source>#<target>
Where:
- <source> is a package URL, physical location or registry name
- <target> is a valid range, commit, branch, etc.
- <name> is the name it should have locally.
```
You're actually not missing anything. Bower doesn't deal with loading your dependencies, just installing them. Loading them is something you have to do on your own. Also, there are a lot various ways in which people load there dependencies; the most common probably being Require.JS, Browserify (have too few credits to post links) and plain script includes in an index.html page. So, basically you have a few options here
You can just deal with load registrations manually. This would mean adding <script src="..."></script> tags to your index.html page, or adding registrations for dependencies and similar to your app.js if you're using Require.JS. Note that this step would mean that you'd manually have to look at each dependency, read documentation or bower.json files to figure out transitive dependencies and file paths.
If you're using plain script includes, you can use Wiredep to have that done automatically for you through Wiredep's inspection of the bower.json files of dependencies.
If you're using RequireJS (or similar) you can look at Yeoman's grunt-require-js to do this automatically for you.
Note that both 2 and 3 relies on library authors provide the correct output files. You might e.g. have to declare overrides or explicitly declare if you want minified or non-minified versions.
As for publicly allowing access to "bower_components", I find that this is the most common approach. What things there would you like to prevent access to?
I'm a recent bower user myself. And as far as I know the short answer is: YES, bower is meant to download dependencies, however, apart from being able to configure the bower_components directory to anything you like, the idea is that bower installed components won't be edited by you at all, if you want to include them manually, you type
bower list --paths
and this will list all the files you need to include from the dependencies (in relative urls).
You can also use bower-installer (npm install -g bower-installer) which allows you to copy the files you need to any path you like. With a fine grained controll, or choose the minified versions, for example.
Here's an example output.
C:\Users\german\test>bower install bootstrap
bower bootstrap#* not-cached git://github.com/twbs/bootstrap.git#*
bower bootstrap#* resolve git://github.com/twbs/bootstrap.git#*
bower bootstrap#* download https://github.com/twbs/bootstrap/archive/v3.3.4.tar.gz
bower bootstrap#* extract archive.tar.gz
bower bootstrap#* resolved git://github.com/twbs/bootstrap.git#3.3.4
bower jquery#>= 1.9.1 not-cached git://github.com/jquery/jquery.git#>= 1.9.1
bower jquery#>= 1.9.1 resolve git://github.com/jquery/jquery.git#>= 1.9.1
bower jquery#>= 1.9.1 download https://github.com/jquery/jquery/archive/2.1.4.tar.gz
bower jquery#>= 1.9.1 extract archive.tar.gz
bower jquery#>= 1.9.1 resolved git://github.com/jquery/jquery.git#2.1.4
bower bootstrap#~3.3.4 install bootstrap#3.3.4
bower jquery#>= 1.9.1 install jquery#2.1.4
bootstrap#3.3.4 bower_components\bootstrap
└── jquery#2.1.4
jquery#2.1.4 bower_components\jquery
C:\Users\german\test>bower list --paths
jquery: 'bower_components/jquery/dist/jquery.js',
bootstrap: [
'bower_components/bootstrap/less/bootstrap.less',
'bower_components/bootstrap/dist/css/bootstrap.css',
'bower_components/bootstrap/dist/js/bootstrap.js',
'bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.eot',
'bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.svg',
'bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.ttf',
'bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.woff',
'bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.woff2'
]
after
bower list --paths
bootstrap[] shows all the files I need to include according to bower_components/bootstrap/bower.json
main:[]
part
Hope this helps! cheers.

Bower: force update of local package

I need to force bower to override a locally-defined dependency with a fresh copy. I assumed that bower update <package> would do the trick (even with a little extra --force). However, it stubbornly prefers whatever copy is installed under bower_components.
Consider the following layout (all in one codebase for now, sadly):
shared/bower.json
{
"name": "mysharedstuff",
"version": "0.0.1",
...
}
client1/bower.json
{
...
"dependencies": {
"mysharedstuff": "../shared"
}
}
The only way I can get a fresh copy of shared/ is to explicitly delete the copy installed under bower_components. For example:
client1$> rm -rf bower_components/mysharedstuff
client1$> bower install
Is this a bug with how bower handles versioning of local dependencies? Or am I missing something simple?
Just to update from the github issue you referenced.
bower --force update
will force update any packages in your bower.json.
Works in Bower > v1.3.6
Because bower looking for latest TAG name in your repo. Specify your last commit with git tag.

Installing non-bower-ready library with Bower

I am using Bower (http://bower.io/) to manage my app's third-party libraries and now I want to use a library which doesn't have a registered bower package, namely jquery.cloudinary.js from Cloudinary (http://cloudinary.com).
I would really love to include cloudinary amongst my bower-managed libraries because it really helps cloning my development environment when I need to.
Is it possible to install any library available in the internet with Bower by just editing my bower.json file? If so, how?
I guess I could either ask Cloudinary to create and register a Bower package or do it myself but I am still in doubt whether I should do any of these.
Register it or install with the git url directly: bower install http://website.com/repo.git
From the Bower readme:
Bower offers several ways to install packages:
Using a local or remote package
bower install <package>
Where <package> can be any one of the following:
A name that maps to a package registered with Bower, e.g, jquery. ‡
A remote Git endpoint, e.g., git://github.com/someone/some-package.git. Can be public or private. ‡
A local endpoint, i.e., a folder that's a Git repository. ‡
A shorthand endpoint, e.g., someone/some-package (defaults to GitHub). ‡
A URL to a file, including zip and tar files. Its contents will be extracted.

Resources