Skip to content

Instantly share code, notes, and snippets.

@pwenzel

pwenzel/01-Makefile

Last active Feb 20, 2020
Embed
What would you like to do?
This gist accompanies https://github.com/pwenzel/fswatch-makefile. It shows how one might build a tiny build system for a website using a Makefile.
# Example Makefile for compiling CSS and Javascript in watched folder
PHONY: optimize
css:
@cat assets/css/normalize.css assets/css/app.css > public/assets/all.css
@echo Built all.css
js:
@cat assets/js/jquery.js assets/js/jquery.cookie.js assets/js/app.js > public/assets/all.js
@echo Built all.js
watch:
@echo Watching for changes...
@fswatch assets/css:assets/js "echo changed && make css js"
optimize: css js
@yuicompressor assets/all.css -o assets/all.css
@yuicompressor assets/all.js -o assets/all.js
@echo Optimized all.js
# Example Makefile for compiling Javascript in watched folder
PHONY: optimize
js:
@cat assets/js/jquery.js assets/js/jquery.cookie.js assets/js/app.js > public/assets/all.js
@echo Built all.js
watch:
@echo Watching for changes...
@fswatch assets/js "echo changed && make js"
optimize: css js
@yuicompressor assets/all.js -o assets/all.js
@echo Optimized all.js
# Example Makefile for compiling CSS in watched folder
PHONY: optimize
css:
@cat assets/css/normalize.css assets/css/app.css > public/assets/all.css
@echo Built all.css
watch:
@echo Watching for changes...
@fswatch assets/css "echo changed && make css"
optimize: css js
@yuicompressor assets/all.css -o assets/all.css
@echo Optimized all.js
# Kitchen Sink Makefile for compiling CSS and Javascript in watched folder
# Uses variable lists for folks who like complexity
# Creates a version file in your project for asset versioning
PHONY: css js version
cssfiles = 'assets/css/normalize.css' 'assets/app.css'
jsfiles = 'assets/js/jquery.js' 'assets/js/jquery.cookie.js' 'assets/app.js'
css: $(cssfiles)
@echo Built all.css
js: $(jsfiles)
@echo Built all.js
$(cssfiles):
@cat $@ >> assets/all.css
$(jsfiles):
@cat $@ >> assets/all.js
watch:
@echo Watching for changes...
@fswatch assets/css:assets/js "echo changed && make clean && make"
optimize: css js version
@yuicompressor assets/all.css -o assets/all.css
@yuicompressor assets/all.js -o assets/all.js
@echo Optimized
version:
@echo `date +%s` > version
clean:
@rm -f assets/all.css assets/all.js version
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment