Skip to content

Instantly share code, notes, and snippets.

@uberboom
Created Feb 6, 2015
Embed
What would you like to do?
Bash: Watch for changes in SASS files and build the CSS target file (with LiveReload support)
#!/bin/sh
#
# Configuration
#
# sass source
SASS_SOURCE_PATH="resources/scss"
SASS_SOURCE_FILE="main.scss"
# sass options
SASS_OPTIONS="-t compressed -l -m"
# css target
CSS_TARGET_PATH="public/css"
CSS_TARGET_FILE="main.css"
#
# Check prerequisites
#
sasscfile=$(command -v sassc) || { echo "sassc is required but not installed"; exit 1; }
livereloadxfile=$(command -v livereloadx) || { echo "livereloadx is required but not installed"; exit 1; }
fswatchfile=$(command -v fswatch) || { echo "fswatch is required but not installed"; exit 1; }
#
# Start livereloadx as a background process
#
nohup $livereloadxfile "$CSS_TARGET_PATH" >/dev/null 2>&1 &
#
# Watch folder for changes
#
$fswatchfile --recursive --one-per-batch "$SASS_SOURCE_PATH" | xargs -n1 -I{} $sasscfile $SASS_OPTIONS "$SASS_SOURCE_PATH/$SASS_SOURCE_FILE" "$CSS_TARGET_PATH/$CSS_TARGET_FILE"
@uberboom

This comment has been minimized.

Copy link
Owner Author

@uberboom uberboom commented Feb 6, 2015

Requirements:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment