Search code examples
cssmedia-queriesminifyyui-compressor

Is there a version of YUI Compressor that deals correctly with media queries?

YUI Compressor has a known bug where some media queries, including those used to serve styles to iOS and Android devices (e.g. @media screen and (max-device-width: 480px) {...}), are broken when compressed, because the space between the and and the opening brace is removed.

The latest version available for download from the homepage (2.4.2) still has this issue.

Is there an updated version available where this issue is fixed?

Solution

  • Yes — this issue is fixed in 2.4.4, which is downloadable from YUI Compressor’s git project:

    This version seems to work, at least on Mac OS X 10.6.4.

    Instructions:

    1. Download the zipped source from the page above, and unzip it.
    2. In the Terminal, change into the unzipped source folder.
    3. Type ant and hit return. This will create a folder called build, and put the built jar file in it. The built jar file is called yuicompressor-2.4.5pre.jar
    4. Change into the build folder, and run chmod +x yuicompressor-2.4.5pre.jar to make the jar file executable.
    5. Optionally, move the jar file into /usr/local/bin/
    6. Optionally, create an alias in your .profile file to make it easier to run, e.g. alias yuic="java -jar /usr/local/bin/yuicompressor-2.4.5pre.jar"