martes, 15 de septiembre de 2009

CSS: Comprimir archivos CSS rápidamente en Visual Studio

Es relativamente sencillo, solo hay que descargar el ejecutable "YUI Compressor". Descomprimimos el archivo en un directorio que preferiblemente debemos crear. Luego vamos a Visual Studio y en: Herramientas -> Herramientas Externas ponemos:

Título: YUI Compression
Comando: C:\WINDOWS\system32\java.exe
Argumentos: -jar C:\Compresor\yuicompressor-2.4.2.jar $(ItemPath) -o $(ItemPath) –v

Argumentos para comprimir CSS con copia sin tener que reemplazar el original:

-jar C:\Compresor\yuicompressor-2.4.2.jar $(ItemPath) -o $(ItemDir)$(ItemFileName).min$(ItemExt) –v


Argumentos para comprimir JS:

-jar C:\Compresor\yuicompressor-2.4.2.jar $(ItemPath) -o $(ItemPath) –v --charset utf-8

Argumentos para comprimir JS con copia sin reemplazar el original:

-jar C:\Compresor\yuicompressor-2.4.2.jar $(ItemPath) -o $(ItemDir)$(ItemFileName).min$(ItemExt) –v --charset utf-8

Nota: Después de comprimir un archivo CSS sería bueno quitar el punto y coma que siempre se pone al final de cada regla de las clases o selectores. El punto y coma en la última regla es opcional. Para quitarlo rápidamente ese punto y coma, simplemente hay que hacer un "Replace" de la siguiente combinación de caracteres:

;) (punto y coma con paréntesis)

Luego aceptamos el cuadro de diálogo y listo. Para hacer la prueba, abrimos un archivo CSS en Visual Studio, y luego vamos a Herramientas -> YUI Compression. El resultado será que todas las reglas de CSS se comprimen al máximo; es decir, desaparecen espacios, cambios de línea innecesarios y todo al final queda en una sola línea o más líneas dependiendo de la cantidad de CSS que tenga el archivo. Pero definitivamente lo comprime.

Está de sobra decir, pero para los novatines, les comento que hay que tener java instalado.

Por cierto, ¿saben cómo restaurar el código CSS a su estado original? Yo si sé, jaja!, solo hay que presionar la siguiente combinación de teclas: Ctrl + K + D. Dependiendo de los settings que tengan su Visual Studio, esa combinación de teclas puede ser diferente, por eso, en caso de que no funcione verifiquen en el menú Editar -> Opciones Avanzadas.

Y para mayor detalle una demostración de tantas que existen en YouTube:


También está éste link: Ver

Yui compressor online:Ver

No hay comentarios: