Skip to content

Instantly share code, notes, and snippets.

@pearofducks
Last active Apr 13, 2021
Embed
What would you like to do?
Basic frontend makefile
# this tells Make to run 'make help' if the user runs 'make'
# without this, Make would use the first target as the default
.DEFAULT_GOAL := help
# here we have a simple way of outputting documentation
# the @-sign tells Make to not output the command before running it
help:
@echo 'Available commands:'
@echo -e 'dev \t\t - \t run the development environment
@echo -e 'prod \t\t - \t build for production
# setting a command up so we can run yarn before any other command
# this way our dependencies will always be up to date
yarn:
yarn
# running 'make dev' will first run yarn
# then start Rollup and Sass in watch mode
dev: WATCH = --watch
dev: yarn build
# running 'make prod' will first run yarn
# then will clean up our old css build
# then will run Rollup and Sass for a production build
prod: export NODE_ENV = production
prod: yarn clean build
# the '-' before rm below allows that command to fail
# even if this fails, make will continue running
# this is a contrived example
clean:
-rm ./dist/main.css
build: js css
js:
npx rollup -c $(WATCH)
css:
npx sass $(WATCH) main.scss ./dist/main.css
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment