Skip to content
This repository has been archived by the owner on Oct 6, 2021. It is now read-only.

Improve project Makefile #131

Merged
merged 1 commit into from
Jan 4, 2017
Merged

Improve project Makefile #131

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
97 changes: 65 additions & 32 deletions project_template/Makefile
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,49 +1,82 @@
export DIST_DIR ?= ./dist
export SHELL := /bin/bash -e -o pipefail
export SHELL := /usr/bin/env bash -e -o pipefail
export PATH := $(PATH):$(shell npm bin)
export APP_ENV ?=development
DIST_DIR := ./dist
BUILD_DIR ?= ./tmp/build
WATCH_BUILD_DIR := ./tmp/watch-build
JS_BUNDLE_MAIN := app/application.coffee

dist: clean build-statics build-js build-icons build-css revhash
WEBPACK_FILES := $(shell find app -name '*.coffee' -o -name '*.hamlc' -o -name '*.yml' -o -name '*.json')
SCSS_FILES := $(shell find app/styles -name '*.scss')
PUBLIC_FILES := $(shell find public -type f)
ICON_FILES := $(shell find app/styles/icons -name '*.svg')
ICON_FILES_TARGET := $(patsubst %, $(BUILD_DIR)/assets/fonts/icons.%, woff eot ttf)
PUBLIC_FILES_TARGET := $(PUBLIC_FILES:public/%=$(BUILD_DIR)/%)
ALL_TARGETS := $(BUILD_DIR)/assets/app.js \
$(ICON_FILES_TARGET) \
$(BUILD_DIR)/assets/app.css \
$(PUBLIC_FILES_TARGET)

production:
APP_ENV=production make build
dist: check-env $(ALL_TARGETS) copy-to-dist

build-statics:
cp -R public/* $(DIST_DIR)/
$(BUILD_DIR)/assets/app.js: $(WEBPACK_FILES)
@echo Compiling js
@mkdir -p $(@D)
@webpack --hide-modules --output-path $(BUILD_DIR)/assets/

revhash:
source bin/_functions ; HASH=$$(cat $(DIST_DIR)/assets/app.js | _md5) && \
mv $(DIST_DIR)/assets/app.js $(DIST_DIR)/assets/app-$$HASH.js && \
perl -i -pe s/app.js/app-$$HASH.js/ dist/index.html
$(BUILD_DIR)/assets/app.css: $(SCSS_FILES) $(ICON_FILES)
@echo Compiling sass
@mkdir -p $(@D)
@node-sass --stdout --output-style $${CSS_OUTPUT_STYLE:-compressed} --include-path vendor/styles app/styles/application.scss | postcss --use autoprefixer --autoprefixer.browsers 'ios >= 8, android >= 4, ie >=10' > $(BUILD_DIR)/assets/app.css

source bin/_functions ; HASH=$$(cat $(DIST_DIR)/assets/app.css | _md5) && \
mv $(DIST_DIR)/assets/app.css $(DIST_DIR)/assets/app-$$HASH.css && \
perl -i -pe s/app.css/app-$$HASH.css/ dist/index.html
$(ICON_FILES_TARGET): $(ICON_FILES)
@echo Building icon font
@DIST_DIR='$(BUILD_DIR)' node script/build-iconfont.js

build-js:
webpack --output-path $(DIST_DIR)/assets/
$(BUILD_DIR)/%: public/%
@echo "Copying $<"
@mkdir -p $(@D)
@cp "$<" "$@"

build-css:
node-sass --stdout --output-style $${CSS_OUTPUT_STYLE:-compressed} --include-path vendor/styles app/styles/application.scss | postcss --use autoprefixer --autoprefixer.browsers 'ios >= 8, android >= 4, ie >=10' > $(DIST_DIR)/assets/app.css
copy-to-dist:
@echo Copying to $(DIST_DIR)
@rm -rf $(DIST_DIR)/*
@mkdir -p $(DIST_DIR)
@cp -R $(BUILD_DIR)/* $(DIST_DIR)

build-icons:
DIST_DIR='$(DIST_DIR)' node script/build-iconfont.js
@source bin/_functions ; HASH=$$(cat $(DIST_DIR)/assets/app.js | _md5) && \
mv $(DIST_DIR)/assets/app.js $(DIST_DIR)/assets/app-$$HASH.js && \
perl -i -pe s/app.js/app-$$HASH.js/ $(DIST_DIR)/index.html

serve: DIST_DIR := './tmp/watch-build'
serve: clean build-statics build-icons build-css
onchange 'public/**/*' -- make build-statics &
CSS_OUTPUT_STYLE=expanded onchange 'app/styles/**/*.scss' -- make build-css &
onchange 'app/styles/icons/*.svg' -- make build-icons &
webpack --output-path $(DIST_DIR)/assets/ --watch &
sleep 2 && maji-dev-server $(DIST_DIR) --port=$(SERVER_PORT) --livereload=$(LIVERELOAD)
@source bin/_functions ; HASH=$$(cat $(DIST_DIR)/assets/app.css | _md5) && \
mv $(DIST_DIR)/assets/app.css $(DIST_DIR)/assets/app-$$HASH.css && \
perl -i -pe s/app.css/app-$$HASH.css/ $(DIST_DIR)/index.html

watch: serve
clean:
@rm -rf $(BUILD_DIR)
@rm -rf $(WATCH_BUILD_DIR)

test:
bin/ci

clean:
rm -rf $(DIST_DIR) && mkdir -p $(DIST_DIR)/assets
check-env:
@# check if we previously build with a different APP_ENV. If the APP_ENV has changed
@# we need to recompile
@[ "$$(cat tmp/.build-env 2>/dev/null)" == "$(APP_ENV)" ] || (echo '$(APP_ENV)' > tmp/.build-env && touch $(JS_BUNDLE_MAIN))
@echo Building with APP_ENV = $(APP_ENV)

watch:
@BUILD_DIR=$(WATCH_BUILD_DIR) $(MAKE) doWatch

doWatch: check-env $(ALL_TARGETS)
@onchange 'public/**/*' -- $(MAKE) FILE='{{changed}}' copy-watched-file &
@CSS_OUTPUT_STYLE=expanded onchange 'app/styles/**/*.scss' -- $(MAKE) $(BUILD_DIR)/assets/app.css &
@onchange 'app/styles/icons/*.svg' -- $(MAKE) -s $(BUILD_DIR)/assets/fonts/icons.eot &
@webpack --output-path $(BUILD_DIR)/assets/ --watch &
@sleep 2 && maji-dev-server $(BUILD_DIR) --port=$(SERVER_PORT) --livereload=$(LIVERELOAD)

copy-watched-file:
@echo "Copying $(FILE)"
@cp "$(FILE)" "$(BUILD_DIR)/"

.PHONY: clean build-statics build-js build-css build-icons serve watch
.SILENT: serve revhash
.PHONY: clean dist test check-env copy-to-dist watch doWatch copy-watched-file