bower_concat equivalent for NPM

Question

bower_concat is great. When you add a bower package using:

bower install something --save

bower_concat will automatically retrieve the javascript and CSS from that package and concantenate it into a bundle, so you end with a nice vendor.js and vendor.css files that you can then minify and inject in you html.

With the advent of angular2 though, and the Typescript import system, all the packages, including the one used in your app, are going through NPM.

Is there an equivalent of bower_concat for NPM ? It would retrieve you CSS automatically and produce a bundle with it ?

Answer 1

Webpack is definitely the way to go. You have to rework your code a bit, the best being to use ES6 import (use babel to downgrade to ES5 if needed) and webpack will 'just work'(c).

With Webpack you can get rid of bower, but also require and even grunt if your setup is simple enough.

How does it work? It takes a file (the 'main' file) and will then go through the import dependency to pack them into one (or several) files. While it concatenate them you can apply 'loaders'. Loaders are tool which take the file as input and the output will be taken back by Webpack. Loaders can minify, uglify, transpile or apply any arbitrary transformation. THere are many loaders out there.

I am not looking back...

Answer 2

this package is similar your package , see this it will help you https://www.npmjs.com/package/node-minify