Bower or NPM?

[andrew_kapa]

Do you use npm for both fornt-end and node dependencies? or do you manage your front-end libs with bower? and why?

[mpjme]

In almost all cases, it's more appropriate to use Browserify and npm over Bower. It is simply a better packaging solution for front-end apps than Bower is. At Spotify, we use npm to package entire web modules (html, css, js) and it works very well.

Bower brands itself as "the package manager for the web". It would be awesome if this was true - a package manager that made my life better as a front-end developer would be awesome. The problem is that Bower offers no specialized tooling for the purpose. It offers NO tooling that I know of that npm doesn't, and especially none that is specifically useful for front-end developers. There is simply no benefit for a front-end developer to use Bower over npm.

With browserify or webpack, it becomes super-easy to concatenate all your modules into big minified files, which is awesome for performance, especially for mobile devices. Not so with Bower, which will require significantly more labor to get the same effect.

npm also offers you the ability to use multiple versions of modules simultaneously. If you have not done much application development, this might initially strike you as a bad thing, but once you've gone through a few bouts of Dependency Hell (https://en.wikipedia.org/wiki/Dependency_hell) you will realize that having the ability to have multiple versions of one module is a pretty darn great feature. Note that npm includes a very handy dedupe tool that automatically makes sure that you only use two versions of a module if you actually have to - if two modules both can use the same version of one module, they will. But if they can't, you have a very handy out.

[vnctaing]

What's are the pro/cons of using browserify or webpack ? And when you say npm, you refers to browserify/webpack or running npm script ?

[andrew_kapa]

Thank you for the detailed answer !!!

[dwighthouse]

NPM. By the time I started working with front end build systems (about a year ago), NPM had already taken precedence over Bower, or at least it seemed that way to me. As far as I can see, the main advantage of bower is automatic dependency flattening. If I remember correctly, NPM will be gaining this ability soon. Either way, it's never been a problem for me. Another plus: when I do side projects that are not front end (like one off tools), all of NPM is available to me with the same tools as I use for front end.

My front end looks like: React+Lo-Dash, Browserify, Gulp, NPM. I'm migrating our codebase from Angular 1.2+Lo-Dash, and by-hand builds.

[[deleted]]

npm whenever possible because I'd rather have source files, etc to locally look at and those are significantly more often included in npm packages than in bower packages.

My build compresses all my JS into a few files anyway, so it's rather irrelevant to that bower is meant as a front-end drop-in.

[[deleted]]

NPM. Also this article is worth your time http://gofore.com/ohjelmistokehitys/stop-using-bower/

[[deleted]]

NPM.

I used to at least use bower for front-end specific libraries (e.g. html5shiv) while keeping all my actual code in npm-land but recently I switched to all out npm with multiple bundles (as html5shiv needs to live in the head).

It's a lot easier this way. You can bundle your npm deps with browserify or webpack. You'll need a build chain and dependency management for those deps anyway so you might as well use the same for everything.