npm Front-End Workflow

Useful resources for npm based front-end development workflows and using npm as a build tool.

Articles

Browsersync Browsers are automatically updated as you change HTML, CSS, images and other project files.
browser-refresh Node.js module to enable server restart and browser refresh in response to file modifications.
reload Refresh and reload your code in your browser when your code changes. No browser plugins required.
live-server A simple development http server with live reload capability.
live-reload A live reload server & client

rerun-script Invoke npm scripts upon file changes.
onchange Use glob patterns to watch file sets and run a command when anything is added, changed or deleted.
watch Utilities for watching file trees.
npm-watch Run scripts from package.json when files change.

npm-run-all A CLI tool to run multiple npm-scripts in parallel or sequential.
better-npm-run Better NPM scripts runner
concurrently Run multiple commands concurrently. Like npm run watch-js & npm run watch-less but better.

cpx A cli tool to watch and copy file globs.
copyfiles Copy files on the command line
cpy-cli User-friendly by accepting globs and creating non-existant destination directories.
ncp Asynchronous recursive file & directory copying.
node-sync-files Synchronize files or folders locally, with a watch option.

clean-CSS Fast and efficient CSS optimizer for node.js and the Web
Purgecss Purgecss removes unused selectors from your css, resulting in smaller css files.
PurifyCSS A function that takes content (HTML/JS/PHP/etc) and CSS, and returns a file made up of only the selectors you use.
PurifyCSS Extended Fork from the original purifycss
uncss UnCSS is a tool that removes unused CSS from your stylesheets. It works across multiple files and supports Javascript-injected CSS.
dropcss A simple, thorough and fast unused-CSS cleaner

imagemin-cli Minify images seamlessly
imageoptim-cli Automates ImageOptim, ImageAlpha, and JPEGmini (commercial software) for Mac to make batch optimisation of images part of your automated build process.

Utilities to perform common command-line tasks without worrying about cross-platform compatibility.

rimraf - Delete files or directories; like rm -rf.
del-cli - Safer file and folder deletion.
mkdirp - Create a directory, creating parent directories if needed; like mkdir -p.
cpy-cli - File/directory copying/renaming.
copyfiles - Copy a list of files into a directory.
sync-files - rsync-like directory syncing with watch mode.
echo-cli - Cross-platform echo with JS escape sequence support.
clear-cli - Clear the terminal.
cross-env - Set environment variables for scripts, unix-style.
cross-os - Run platform-specific npm scripts.
ntee - Utility that reads from standard input and writes to standard output and files; like Unix tee.
catw - Print a file to stdout, with optional watch mode; sorta like Unix cat.

postcss-style-guide PostCSS plugin to generate a style guide automatically. CSS comments will be parsed through Markdown and displayed in a generated HTML document.
markdown-styleguide-generator Will search all your (s)css files for comments and generate a single page html styleguide.
styledown Markdown-based styleguide generator.
kss-node To get you up and running quickly, a style guide generator is included that can be used from the command line. It parses stylesheets and spits out a set of static HTML files.

grunty Run any grunt plugin as NPM script without Gruntfile.js
nps All the benefits of npm scripts without the cost of a bloated package.json and limits of json