How do I minify and compress CSS & JS files on Linux or Unix-like system using shell prompt on my server? How can I minify JavaScripts and stylesheets at shell promot so they can download faster over the Internet without using any online tools?

 

You need to use “YUI Compressor” tool. It is widely used for minifying JavaScripts and stylesheets. From the project page:

The YUI Compressor is JavaScript minifier designed to be 100% safe and yield a higher compression ratio than most other tools. Tests on the YUI Library have shown savings of over 20% compared to JSMin (becoming 10% after HTTP compression). The YUI Compressor is also able to compress CSS files by using a port of Isaac Schlueter’s regular-expression-based CSS minifier.

Step #1: Install JAVA on Linux or Unix

You need JAVA to run yuicompressor. See how to install JAVA on Linux:

Install JAVA SDK on a CentOS/RHEL based system

Instal latest JAVA SDK on a Debian/Ubuntu based system

Once Java installed on the system, make sure you can see the JDK info with the following command:

whereis java

which java

java -version

Sample outputs:

Fig. 01: Make sure java is installed on a Linux/Unix based system

 

Also, make sure you set correct path to JAVA_HOME in your shell startup file. For example:

export JAVA_HOME= /usr/lib/jvm/jre-1.7.0-openjdk.x86_64

Step #2: Install yuicompressor on a Linux and Unix-like system

Type the following wget command to download the latest version of yuicompressor:

$ mkdir -p $HOME/yuicompressor

$ cd !!:$

$ wget https://github.com/yui/yuicompressor/releases/download/v2.4.8/yuicompressor-2.4.8.jar

How do I run yuicompressor?

Type the following command to run the yuicompressor directly:

$ java -jar yuicompressor-2.4.8.jar

Sample outputs:

YUICompressor Version: 2.4.8

 

Usage: java -jar yuicompressor-2.4.8.jar [options] [input file]

 

Global Options

-V, –version             Print version information

-h, –help                Displays this information

–type <js|css>           Specifies the type of the input file

–charset <charset>       Read the input file using <charset>

–line-break <column>     Insert a line break after the specified column number

-v, –verbose             Display informational messages and warnings

-o <file>                 Place the output into <file>. Defaults to stdout.

Multiple files can be processed using the following syntax:

java -jar yuicompressor.jar -o  .css$:-min.css  *.css

java -jar yuicompressor.jar -o  .js$:-min.js  *.js

 

JavaScript Options

–nomunge                 Minify only, do not obfuscate

–preserve-semi           Preserve all semicolons

–disable-optimizations   Disable all micro optimizations

 

If no input file is specified, it defaults to stdin. In this case, the  type

option is required. Otherwise, the  type  option is required only if the input

file extension is neither  js  nor  css .

Example: Compress and Minify a CSS file

In this example, I am going to to compress style.css code file to reduce file size and make site load faster. My current file size:

$ ls -l style.css

 

Sample outputs:

-rw-r–r–. 1 vivek vivek 46909 Jan 11 21:33 style.css

Next, call the yuicompressor directly with a command:

$ java -jar yuicompressor-2.4.8.jar –type css style.css > mini_style.css

 

OR

$ java -jar yuicompressor-2.4.8.jar –type css -o mini_style.css style.css

 

Again, list minified/compressed css file and note down the file size with the help of ls command:

$ ls -l mini_style.css

 

Sample outputs:

-rw-r–r–. 1 vivek vivek 36576 Jan 11 21:33 mini_style.css

Here is a bash for loop to compress multiple CSS files:

for i in ie.css style.css tutorial.css social.css

do

java -jar yuicompressor-2.4.8.jar –type css -o  mini_$i   $i

done

Example: Compress and Minify a Javascript file

The syntax is:

$ java -jar yuicompressor-2.4.8.jar –type js nixcraft.js > mini_nixcraft.js

 

OR

$ java -jar yuicompressor-2.4.8.jar –type js -o mini_nixcraft.js nixcraft.js

 

Here is a bash for loop to compress js files:

for i in nixcraft.js ads.js demo.js ui.js

do

java -jar yuicompressor-2.4.8.jar –type js -o  mini_$i   $i

done

References

Download YUI compressor

Download Oracle JAVA JDK for Linux/Unix