Tengo un archivo CSS comprimido (todo el espacio en blanco eliminado) que quiero inspeccionar, pero es un gran dolor inspeccionarlo tal como está. ¿Hay alguna utilidad (preferiblemente la línea de comandos de Linux) a la que pueda ejecutar el archivo para formatearlo bien?¿Hay una aplicación para formatear automáticamente los archivos CSS?
yo escribimos un poco formateador en Ruby para usted. Guardarlo como algún archivo .rb y utilizarlo a través de CLI como ruby format.rb input.css input-clean.css:
#Formats CSS
input, output = ARGV
#Input
if input == nil or output == nil
puts "Syntax: #{$0} [input] [output]"
exit
end
#Opens file
unless File.exist? input
puts "File #{input} doesn't exist."
exit
end
#Reads file
input = File.read input
#Creates output file
output = File.new output, "w+"
#Processes input
input = input.gsub("{", "\n{\n\t")
.gsub(",", ", ")
.gsub(";", ";\n\t")
.gsub(/\t?}/, "}\n\n\n")
.gsub(/\t([^:]+):/, "\t" + '\1: ')
#Writes output
output.write input
#Closes output
output.close
Probar this online service.
También puede inspeccionar cualquier archivo comprimido en Firebug.
Estaba mirando el archivo en las herramientas de desarrollo de Chrome, pero no estaba formateándolo en absoluto. – Herms
Sí, pero Firebug formatea CSS muy bien en su pestaña CSS. Eso –
servicio en línea también se ha convertido en una línea de comandos utlity versátil, con Node.js https://github.com/mrcoles/cssunminifier - consulte el archivo Léame en esa página para saber cómo utilizarlo – MrColes
Estos programas se llaman 'embellecimiento'. Debería poder googlear uno que se ajuste a usted.
* * Que 's la palabra! Sabía que había un término para eso, pero estaba dibujando un completo espacio en blanco. – Herms
(o "prettify") – isomorphismes
Aquí hay una aplicación gratuita de Windows para "embellecer" su archivo. No lo he usado, así que no sé qué tan bien funciona. http://www.blumentals.net/csstool/
Las aplicaciones de Windows realmente no me ayudan. Tengo una máquina ubuntu y una laptop Mac, así que realmente necesito algo que funcione en uno de esos. Gracias sin embargo. – Herms
Es específico, pero Visual Studio lo hace en ese tipo de archivo. (de ninguna manera es una solución genérica a la que alude)
Esto también guiones: styleneat
El servicio en línea que Dave Newman mencionado se ha convertido en un guión Node.js, que se puede ejecutar en la línea de comandos. Si tiene NPM instalado, puede hacerlo:
npm install -g cssunminifier
Y es muy versátil cómo puede usarlo. Aquí hay 3 ejemplos diferentes:
cssunminifier style.min.css style.css
cssunminifier --width=8 style.min.css
curl http://cdn.sstatic.net/stackoverflow/all.css | cssunminifier - | less
Aquí hay más información sobre la command-line css unminifier
Es bueno que esto también permita reemplazar un archivo con su bonita versión impresa. Entonces, puede hacer, por ejemplo, después de guardar una página web en Firefox como "Página web, completar": 'para el archivo en * .css; hacer cssunminifier $ file $ file; hecho' – tanius
echar un vistazo a la vkBeautify complemento
http://www.eslinstructor.net/vkbeautify/
Se puede embellecer CSS (impresión bonita), Texto XML y JSON,
escrito en lenguaje simple javascript, pequeño, simple y rápido
No funciona 100% para mí, pero probablemente se puede ajustar fácilmente (no parece que les gusta los saltos de línea antes de las llamadas .gsub y se queja. Tal vez una diferencia no escapado {} en la expresión regular versión rubí?). ¡Gracias! – Herms
@Herms, el método String # gsub toma como primer argumento strings simples ("" o "") o expresiones regulares (//) (http://ruby-doc.org/core/classes/String.html#M000817) Las líneas nuevas son solo un azúcar de sintaxis en Ruby. ;-) –
Sí, pero por alguna razón encadenarlos como tú lo hiciste. Si elimino las líneas nuevas, es solo input.gsub(). Gsub(). Gsub() ... funciona. – Herms