Package dependencies in NPM and Bower

Question

First time user of npm and bower. I am able to install packages correctly but I am not sure how the dependencies work? As an example, I did "npm install angularjs" in my application root which created a folder "node_modules/angularjs/" with some files in it. I can also see that there is a package.json file within the angularjs folder, and it looks like it has not been processed as there is numerous packages listed in it and not installed.

Long story short, should I install all these packages manually or is there a built in feature that npm/bower can also process these sets of dependencies?

UPDATE:

I greatly lack the ability to ask precise questions, I apologise to those who have answered and did not give the correct sypnosis.

What I expect to happen:

Using npm or bower, I want to clarify that if I do an install of one of their packages, will it automatically also install the new package's dependancies or would I need to do a npm/bower install for each of the packages.json or bower.json files manually?

What I did to try make it work:

1. Created folder D:\Websites\TestSite
2. Within the folder through CMD, I did a "npm init" and ran through the guide
3. I followed that up with a "npm install angularjs"
4. A new folder was created D:\Websites\TestSite\node_modules\angularjs and within this folder there was a "index.js" and package.json file
5. Opening index.js I get a "require("angular");" and module.exports = window.angular.
6. The package.json file contains a number of dependancies which has not been installed.

My Result:

• As per my expectations, npm install in point 3 above did not install the dependancies of the package.json file after it installed angularjs.
• I am not sure but I assume that the index.js file needs to be included in my html and that it required the requirejs library initiated? If this is the case, then requirejs (which I do not have installed on my site) should be a dependancy for angularjs to work, and should be installed prior to giving me the ability to try and initiate it?
• Am I missing a step or misunderstanding the functionality of NPM/Bower? Thank you for your patience!

Answer 1

Npm and Bower are great tools for managing your dependencies, i'll try to make it clear in a few words.

In general npm is used for managing your back-end dependencies and Bower is responsible for your front end dependencies.

There are 2 config files:

• package.json, here are listed your dependencies that are not used in browser(e.g. bower, grunt). To install all dependencies in package.json run npm install.
• Bower.json, here will be listed your "in browser" dependencies(e.g angular, jQuery). Run bower install to install all dependencies listed here in bower_components

You can find a extended guide i wrote here.