How to make requirements.txt-like file with bower? - javascript

I've started working with bower, and it seems really helpful. I come from a python background, and so I'm used to having virtualenv and requirements.txt.
Since I'd rather not store all my dependencies in source control if I can help it, I was wondering, how can I create a file like requirements.txt with bower?

After poking around a bit more, I have the solution.
bower uses a file called bower.json (formerly component.json) which is similar to a Gemfile or requirements.txt.
It can be created manually, and will look something like this...
{
"name": "<app name, defaults co current folder name>",
"version": "0.0.0",
"dependencies": {
"backbone": "~0.9.10",
"underscore": "~1.4.3"
}
}
However, the piece that I was missing was to include the --save flag when installing packages in bower:
bower install <package_name> --save
Unfortunately, I do not believe there is a way to set this behaviour by default using the .bowerrc file.
As an added tidbit, once you have a bower.json file, installing your dependencies is as simple as running bower install.

Related

Angular 2 library on a private repository

I have to write a library for my app, that can be imported in the other application that I will make. In there will be a lot of functionality related to the get or post with my rest api.
The first think that I have see in google is to publish my code on npm, but I cannot publish there. So I have looked at this example:
How to install an npm package from GitHub directly?
So I have writed my package.json this way:
"dependencies": {
"#angular/animations": "^5.1.0",
...
"myRepo": "git+https://MyUser#git.myRepo.git",
}
And it works,but when I make npm install it download only package.json and readme.md file and nothing else (At the moment in the repo there are a few o file and one directory with one file inside).
Can you help me with this?
Thanks a lot!
My package.json inside the repo that I want to install looks like:
{
name: "myPackage",
version: "1.0.0"
}
And the file in this repo:
directory/
jsfile.js
package.json
readme.md

Why Bower always downloads angular version of v 1.5.9-build.5086+sha...?

I am using bower.json to manage my front end dependencies.. no matter however i specify the version of angular in bower i end up getting different version of angular library... Many of the functionality of my code are from previous version of angulars so the functions like $http.post.success() are depracted here and the code does not work. I need angular v 1.4.8 but it always downloads some other v1.5.9.build version. Here is how i tried downloading the package from bower.json
1) Mentioning the versions only..
"dependencies": {
"angular": "1.4.8",
"jquery": "2.1.4"
},
"resolutions": {
"jquery": "2.1.4",
"angular": "1.4.8"
2) I tried this way as well giving the full path of the repo in github
"dependencies": {
"angular": "https://github.com/angular/bower-angular.git#1.4.8",
"jquery": "2.1.4"
},
"resolutions": {
"jquery": "2.1.4",
"angular": "https://github.com/angular/bower-angular.git#1.4.8"
Any help would be greatly appreciated
So in my case apparently the problem was git from Visualt Studio Web Tools located at
C:\Program Files (x86)\Microsoft Visual Studio 14.0\Web\External\git
With it, bower tries to install correct versions, but if you look into the bower cache you can see that actual downloaded files don't match.
Solutions
Install Git for Windows
Delete %USERPROFILE%\AppData\Local\bower
Restart Visual Studio
Delete wwwroot/lib and Restore bower packages
You might need to change the point the path of current git.exe in VS
for that:
Tools>Options>ProjectsandSolutions>ExternalTools
See the original answer here https://stackoverflow.com/a/38460014/1505521

how to include a private local file in javascript project using bower

i want to include a custom file as one of the bower dependency.
I am have the following bower.json
{
"name": "xyz",
"version": "0.0.0",
"dependencies": {
"sass-bootstrap": "~2.3.0",
"requirejs": "~2.1.4",
"modernizr": "~2.6.2",
"jquery": "~1.9.1",
"beautify": "file:/path/to/beautify.js"
},
"devDependencies": {}
}
But when i do bower install
it gives error :
bower beautify#* ENOTFOUND Package file:/path/to/beautify.js not found
however when i open the same path in browser i get the right file.
I have also checked the case sensitive of the path.
Now can any one tell me what error i am doing? Is there any thing wrong with the syntax?
Also tell me what if i want to add the same via bower cache. Where the global bower cache is stored in mac? And how can we register the url of private package so that i just need to put name of the package in bower.json and bower finds the file from the cache?
The code below didn't work for me using Bower 1.2.8 on Ubuntu.
"beautify": "/path/to/beautify.js"
What did work was using: "beautify": "./path/to/beautify.js". This way the path is pointing to the file relative from the directory where bower.json resides.
It should be just /relative/path/to/beautify.js. No 'file:/'.
"beautify": "/path/to/beautify.js"
If you have bower installed you can do this from the commandline
bower install ../beautify.js -S
Assuming the local repo is a directory next to your current directory. This is just a testing approach and should be an available repo for general use
EDIT
It looks like you also need to tag your repo so you will pick up the latest changes too
git tag v0.0.2

How to register a local git package in Bower?

How can I register a local git package in bower?
My current component.json is as follows
{
"name": "myproject",
"version": "1.0.0",
"dependencies": {
"jquery": "1.8.0",
"twitter/bootstrap": "2.1.1"
}
}
However I also would like to add a package I have created at C:/mypackage which is a git repository with versions tagged.
When I do bower install --save C:/mypackage it properly adds it to project but it doesn't add it to my component.json.
I am trying bower register mypackage C:/mypackage but it keeps giving me
bower error Incorrect format
What am I doing wrong?
Option 1: Public Bower registration
Bower is built mostly to share public (client-side) code in a "non-opinionated" manner. The primary use case, then, is to have a publicly accessible repository (on GitHub) that is registerd with a name and git repository url. I just did this myself:
bower register linksoup git://github.com/automatonic/linksoup
This is just telling the bower server that when you install linksoup to go and grab the code at the git://github.com/automatonic/linksoup repository, and put it in the local project's component directory.
If this is what you want to do, then just set up a repository on github/etc., push your code there, and then register with the resulting repository info.
Option 2: Private dependency
There are many reasons not to post your code at a publicly accessible repository. It may not be open source, etc. if your mypackage code is not meant to be public, then you should probably not be registering it on the public bower server... Further, even if you could register a local directory, it would only work on your machine...which defeats the purpose of sharing the code via bower.
If you just want to have bower manage a local, private dependency, then I am going to riff off of blockhead's solution:
{
"name": "myproject",
"version": "1.0.0",
"dependencies": {
"jquery": "1.8.0",
"twitter/bootstrap": "2.1.1",
"mypackage": "file:///path/to/mypackage/.git"
}
}
This is just saying that myproject needs mypackage, and to use git clone to retrieve it. My guess is that this can use anything git can understand (including local repositories). But you should note that this may run into problems for anyone else working on this code that cannot access your local path.
Best Guess
It looks to me as if you may have assumed that bower register was a local operation (telling bower how to find a dependency via some sort of local registry). As far as I can tell, this is only a remote and public registration, which is why this is unsupported.
You may also be looking for a way to do something like a link operation with npm. That is, work on a dependency module without always having your dev cycle include a publish.
A little detail about how many people are involved and what you were trying to accomplish would facilitate a more targeted answer.
You can add any git repository as follows:
{
"name": "myproject",
"version": "1.0.0",
"dependencies": {
"jquery": "1.8.0",
"twitter/bootstrap": "2.1.1",
"myrepo":"git://myrepo.com/myrepo"
}
}
You can use bower link:
The link functionality allows developers to easily test their packages.
Linking is a two-step process.
Using bower link in a project folder will create a global link.
Then, in some other package, bower link <pkg> will create a link in the components folder
pointing to the previously created link.
This allows to easily test a package because changes will be reflected immediately.
Please note that bower will not fetch the linked package dependencies.
Bower will overwrite the link when installing/updating.
The big idea with bower is to easily share your projects' dependencies. So using local repo should be limited to testing.
Once you understand that, you should know that it is not –strictly– necessary to register your package in order to use it as a dependency.
This is due to the fact that bower depencency can specify either a version, a folder or a package. So you can use local repository.
Define as bower package
First you will need to define your dependency as a bower package:
# create the bower package
cd /path/to/you-need-me
bower init
# answer questions…
Add as project dependency
Then in your main project, the one that need the you-need-me dependency, edit bower.json file to add (or expand):
"dependencies": {
…
"you-need-me": "file:///path/to/you-need-me/.git/"
"you-need-me-windows": "C:/path/to/you-need-me-windows/.git/"
}
So you don't give a version, but an local git endpoint, i.e. the subdirectory .git/.
Install dependency
In the man project install bower dependencies with:
cd /path/to/main-project/
bower install
Failure
bower you-need-me#* ENOTFOUND Package /path/to/you-need-me/ not found
Check again your path and that you point to the .git/ directory of your dependency.
Success
You should get something like:
bower you-need-me#* not-cached file:///path/to/you-need-me/.git/#*
bower you-need-me#* resolve file:///path/to/you-need-me/.git/#*
bower you-need-me#* checkout master
bower you-need-me#* resolved file:///path/to/you-need-me/.git/#b18c753c6f
bower you-need-me#* install you-need-me#b18c753c6f
Write a blog entry about that: Testing bower.json locally before registering package.

Using npm to install or update required packages just like bundler for rubygems

I love Bundler, it's great at dependency management. I love npm, installing node packages is easy! I have a nodejs app and would love to be able to specify my apps dependencies and easily install / update them wherever I deploy my app. This isn't a library I'm releasing, it's a full fledged web-app.
I'm aware of the npm bundle command, but that just seems to simply override the directory where packages are installed.
I'm used to using bundler in this fashion:
# Gemfile
gem "rails", "3.0.3"
Installs rails v3.0.3 and any other required gems on the host machine only if it doesn't already exist
> bundle install
How can I achieve something similar with npm?
As of npm 1.0 (which is now what you get by default if you follow the steps in the README file), "bundle" is no longer a segregated thing -- it's just "how it works".
So:
Put a package.json file in the root of your project
List your deps in that file
{ "name" : "my-project"
, "version" : "1.0.0"
, "dependencies" : { "express" : "1.0.0" } }
npm install Since you're calling this with no args, and not in global mode, it'll just install all your deps locally.
require("express") and be happy.
Edit: This only applies to npm versions < 1.0
It was quite difficult to figure this out, but NPM makes this possible.
You need three components
A subdirectory in your repository (i.e. deps/)
A package.json file in the above directory that lists dependencies
An index.js file in the above directory that requires your dependencies
Example
Imagine that express is your only dependency
deps/package.json
note: Increment the version # each time you modify the dependencies
{
"name": "myapp_dependencies",
"version": "0.0.1",
"engines": {
"node": "0.4.1"
},
"dependencies":{
"express": "2.0.0beta2"
}
}
deps/index.js
export.modules = {
express: require('express')
//add more
}
Now you should be able to install your dependencies using npm. You could even make this part of your deployment process
cd deps
npm install
Then within your app code you can get access to your specific version of express like this:
var express = require('myapp_dependencies').express;
You should read these two articles from Isaacs(author npm) blog. I think they are really good, and I believe tell you how to achieve your goal:
http://blog.izs.me/post/1675072029/10-cool-things-you-probably-didnt-realize-npm-could-do
http://foohack.com/2010/08/intro-to-npm/
I believe link #1(point #11) explains this:
11: Bundle all your dependencies into the package itself
When you use the
npm bundle command, npm will put all
your dependencies into the
node_modules folder in your package.
But it doesn’t stop there.
If you want to depend on something
that’s not on the registry, you can do
that. Just do this:
npm bundle install
http://github.com/whoever/whatever/tarball/master
This will install the contents of that
tarball into the bundle, and then you
can list it as a dependency, and it
won’t try to install it when your
package gets installed.
This also is handy if you have your
own fork of something, and would
prefer not to change the name.
In fact, you can run almost any npm
command at the bundle. To see what’s
inside, you can do npm bundle ls. To
remove something, do npm bundle rm
thing. And, of course, you can install
multiple versions and activate the one
you want.
As of Npm version 1.1.2 , there's a new command npm shrinkwrap which creates an npm-shrinkwrapped.json file, analogous to Gemfile.lock. It's important to make one, to prevent software rot (see Bundler's rationale). Particularly as Nodejs has such a fast moving community.
While bundle install creates a Gemfile.lock automatically, npm install won't create npm-shrinkwrapped.json (but will use it when it exists). Hence you need to remember to use npm shrinkwrap.
Read a full guide at http://blog.nodejs.org/2012/02/27/managing-node-js-dependencies-with-shrinkwrap/
It seems to me that the simplest solution is to use a package.json file with the private flag (added to npm just last month) set to true. That way, you can run npm install or npm bundle to grab your project's dependencies, but you prevent anyone from accidentally publishing your non-public project.
Here's an example package.json:
{
"name": "yourProject"
,"version": "1.0.0"
,"dependencies": { "express" : ">=2.1.0" }
,"private": true
}
Running npm install will install express on the local system if it doesn't already exist; running npm publish gives an error because of the "private": true.
You and your team can use the version tag internally to track dependency changes over time—each time you change a dependency, bump the version. To see which version you've installed, use npm ls installed.
Publish your app with npm as well, and list its dependencies in your package.json file.
When someone uses npm to install your package, npm will take care of resolving its dependencies.
Packages spec: http://wiki.commonjs.org/wiki/Packages/1.0

Categories