2015/09/26 いまどきのフロントエンド環境構築(関西フロントエンドUG) 発表用サンプル

Makefile

PATH := node_modules/.bin:$(PATH)

all: build

.PHONY: all init build styles js html image clean

init:
	npm init
	npm install -D node-sass postcss-cli autoprefixer clean-css uglify-js
	mkdir -p app/styles app/scripts app/images
	touch app/index.html

build: clean styles js html image

styles:
	node-sass app/styles -o .tmp/styles --output-style expanded
	postcss --use autoprefixer .tmp/styles/*.css -d .tmp/styles
	mkdir -p dist/styles
	cat .tmp/styles/*.css | cleancss -o dist/styles/main.css

js: dist/scripts/main.js

dist/scripts/main.js: app/scripts/*.js
	mkdir -p dist/scripts
	uglifyjs app/scripts/*.js -o dist/scripts/main.js

html:
	-cp app/*.html dist/

image:
	mkdir -p dist/images
	-cp -a app/images/ dist/images/

clean:
	-rm -rf .tmp dist