Find unused SCSS variables. Usage: `./find-unused-sass-variables.sh sassDir/`

find-unused-sass-variables.sh

#!/usr/bin/env bash
#
# Approach:
# 1. Find variable declaration in the form of "$my-var: anyvalue"
# 2. Loop through found variables and find occurrences of each variable in all sass files
# 3. Filter out vars that occurred only once

if [ -z "$1" ]; then
	echo "Please specify a directory as the first argument."
	exit 1
fi
if [ ! -d "$1" ]; then
	echo "Not a valid directory."
	exit 1
fi

echo "Finding unused variables. This might take some time..."

vars=$(find "$1" -type f -name "*.scss" -exec grep --color=never -h '^$[a-zA-Z0-9_-][^:]*' {} \; | sed 's/$\([a-zA-Z0-9_-][^:]*\).*/\1/')

for var in $vars; do
	echo -n "Occurrences of \"\$$var\":"
	find "$1" -type f -name "*.scss" -exec grep --color=never -h "$var" "{}" \; | wc -l
done | grep ' 1$'

Works like a charm – thanks!

This is amazing.

If you are always using $ in variable names and you might have variables with A-Z and - or you have variables with the same prefixes like $white and $whiteTransparent the script above will not separate them.

Here is an improved loop that should fix those problems :)

varNameChars='A-Za-z0-9_-'
vars=$(find "$1" -type f -name "*.scss" -exec grep -o "\$[$varNameChars]*:" {} \; | grep -o '[^:]*')
for var in $vars; do 
    echo -n $var
    find "$1" -type f -name "*.scss" -exec grep -o $var"[^$varNameChars]" {} \; | wc -l
done | grep ' 1$'

less version

#! /usr/bin/env bash

if [ -z "$1" ]; then
    echo "Please specify a directory as the first argument."
    exit 1
fi
if [ ! -d "$1" ]; then
    echo "Not a valid directory."
    exit 1
fi

echo "Finding unused variables. This might take some time..."

varNameChars='A-Za-z0-9_-'
vars=$(find "$1" -type f -name "*.less" -exec grep -o "\@[$varNameChars]*:" {} \; | grep -o '[^:]*')
for var in $vars; do
    echo -n $var
    find "$1" -type f -name "*.less" -exec grep -o $var"[^$varNameChars]" {} \; | wc -l
done | grep ' 1$'

Maybe I don't understand the usage, but I just ran this on a directory of .scss files and simply got the following output:

       1
       1

can someone elaborate how to use it :-) thanks

Usage

1. Create a file (e.g. find-unused-variables.sh) having the code mention above (outside your less/sass folder).
2. Run chmod +x ./find-unused-variables.sh to give execute permission to your script.
3. Run ./find-unused-variables.sh less/sass

FYI @jensgeffken

can anyone update the script with a option to add a "variables.less/scss"-file an then search in another directory for the variables?

Usage

1. Create a file (e.g. find-unused-variables.sh) having the code mention above (outside your less/sass folder).
2. Run chmod +x ./find-unused-variables.sh to give execute permission to your script.
3. Run ./find-unused-variables.sh less/sass

FYI @jensgeffken

You can also just run bash ./find-unused-variables.sh instead of step 2, no need to chmod.