simenbrekken/Makefile

## Makefile
# Specify where our binaries are (I'm using package.json and npm to handle dependencies)
LESSC = node_modules/.bin/lessc
UGLIFYJS = node_modules/.bin/uglifyjs

# Our LESS input file(s)
LESS = css/base.less

# Our CSS list (replaces .less with .css in the list)
CSS = $(LESS:.less=.css)

# Our minified CSS list
CSS_MIN = $(CSS:.css=.min.css)

# Our JavaScript targets (head.js goes in <head> and body.js goes before </body>)
JS = js/head.js js/body.js

# Our minified JavaScript list
JS_MIN = $(JS:.js=.min.js)

# Translate from .less to .css using the following command ($< = input file, $@ = output file)
%.css: %.less
    $(LESSC) $< > $@

# The same as above, bith with minification using the YUI CSS Compressor
%.min.css: %.less
    $(LESSC) --yui-compress $< > $@

# And now for our uglifying our JavaScripts
%.min.js: %.js
    $(UGLIFYJS) $< > $@

# This is our default target, so simply typing `make` will run this (dependency is the `dist` target)
all: dist

# This target simply creates distribution versions of our JavaScript and CSS files
dist: js-dist css-dist

# Here's the amazing part, this variable resolves to any outstanding less -> css conversions depending
# on when each .less file was last modified
css: $(CSS)

# The same as above, except we clean up the generated combined CSS files after minifying
css-dist: $(CSS_MIN)
    rm -f $(CSS)

js: $(JS)
js-dist: $(JS_MIN)
    rm -f $(JS)

# Clean up everything we can possibly have made
clean:
    rm -f $(CSS) $(CSS_MIN) $(JS) $(JS_MIN)

# These "pseudo-file" lists produce the given filename using the command below (in this case
# combinging all the listed files)
js/head.js: \
    lib/modernizr.custom.*.js \

    cat $^ > $@

js/body.js: \
    lib/jquery-*.js \
    lib/jquery.*.js \
    lib/underscore-*.js \
    lib/backbone-*.js \
    js/app.js \
    js/*Router.js \
    js/*View.js \

    cat $^ > $@

# These can never be valid targets (because we have folders with these names)
.PHONY: js css
	# Specify where our binaries are (I'm using package.json and npm to handle dependencies)
	LESSC = node_modules/.bin/lessc
	UGLIFYJS = node_modules/.bin/uglifyjs

	# Our LESS input file(s)
	LESS = css/base.less

	# Our CSS list (replaces .less with .css in the list)
	CSS = $(LESS:.less=.css)

	# Our minified CSS list
	CSS_MIN = $(CSS:.css=.min.css)

	# Our JavaScript targets (head.js goes in <head> and body.js goes before </body>)
	JS = js/head.js js/body.js

	# Our minified JavaScript list
	JS_MIN = $(JS:.js=.min.js)

	# Translate from .less to .css using the following command ($< = input file, $@ = output file)
	%.css: %.less
	$(LESSC) $< > $@

	# The same as above, bith with minification using the YUI CSS Compressor
	%.min.css: %.less
	$(LESSC) --yui-compress $< > $@

	# And now for our uglifying our JavaScripts
	%.min.js: %.js
	$(UGLIFYJS) $< > $@

	# This is our default target, so simply typing `make` will run this (dependency is the `dist` target)
	all: dist

	# This target simply creates distribution versions of our JavaScript and CSS files
	dist: js-dist css-dist

	# Here's the amazing part, this variable resolves to any outstanding less -> css conversions depending
	# on when each .less file was last modified
	css: $(CSS)

	# The same as above, except we clean up the generated combined CSS files after minifying
	css-dist: $(CSS_MIN)
	rm -f $(CSS)

	js: $(JS)
	js-dist: $(JS_MIN)
	rm -f $(JS)

	# Clean up everything we can possibly have made
	clean:
	rm -f $(CSS) $(CSS_MIN) $(JS) $(JS_MIN)

	# These "pseudo-file" lists produce the given filename using the command below (in this case
	# combinging all the listed files)
	js/head.js: \
	lib/modernizr.custom.*.js \

	cat $^ > $@

	js/body.js: \
	lib/jquery-*.js \
	lib/jquery.*.js \
	lib/underscore-*.js \
	lib/backbone-*.js \
	js/app.js \
	js/*Router.js \
	js/*View.js \

	cat $^ > $@

	# These can never be valid targets (because we have folders with these names)
	.PHONY: js css