A list of useful npm packages to have for basic front end development

npmUsefulPackages.md

Browserify

"Browserify lets you require('modules') in the browser by bundling up all of your dependencies." npm install -g browserify

browserify main.js -o bundle.js

Express

"Easy node webservers. Express is a minimal and flexible Node.js web application framework that provides a robust set of features for web and mobile applications."

var express = require('express')
var app = express()

app.get('/', function (req, res) {
  res.send('Hello World')
})

app.listen(3000)

Browserify-css

"A Browserify transform for bundling, rebasing, inlining, and minifying CSS files. It's useful for CSS modularization where styles are scoped to their related bundles."

npm install --save-dev browserify-css

app.css:

@import url("modules/foo/index.css");
@import url("modules/bar/index.css");
body {
    background-color: #fff;
}

app.js:

var css = require('./app.css');
console.log(css);

You can compile your app by passing -t browserify-css to browserify:

$ browserify -t browserify-css app.js > bundle.js