menos el compilador dobla todo

Tengo un archivo style.less simple de verry en mi proyecto, y estoy usando bootstrap para un diseño limpio y receptivo. Así que aquí vamos:menos el compilador dobla todo

@import "bootstrap/bootstrap.less"; 

@import "../css/jquery.vegas.css"; 
@import "../css/jquery.fancybox-1.3.4.css"; 

body { 
    padding-top: 60px; 
    padding-bottom: 40px; 
} 

@import "bootstrap/responsive.less";

Ahora, cuando i compilar el archivo con menos, el css-producto tiene un aspecto extraño:

.container { 
    width: 940px; 
    margin-left: auto; 
    margin-right: auto; 
    *zoom: 1; 
    *zoom: 1; 
    width: 940px; 
    margin-left: auto; 
    margin-right: auto; 
    *zoom: 1; 
    *zoom: 1; 
}

Acaba de duplicar todo! Puedo ver este extraño comportamiento incluso en el navegador directamente cuando estoy trabajando en mi instancia devolper.

Eso es tan extraño y horrible, ¿alguien tiene una idea de por qué está sucediendo esto? En los archivos menos originales que se importan desde el arranque, todo se define solo una vez.

Fuente

2012-03-23 jebbie

¿Qué en "responsive.less"? Algunos compiladores eliminan las reglas duplicadas y algunos no ... – prodigitalson

¿Qué versión de LESS estás usando? qué compilador y versión? Esta es información esencial para comenzar a contemplar cuál es su problema ... – sg3s

Disculpe, la versión de menos es 1.2.0 y la estoy lanzando con Windows script host -> http://blog.dotsmart.net/2010/11/ 26/running-the-less-js-command-line-compiler-on-windows/ El contenido de "responsive.less" tiene algunas otras importaciones (variables.less, mixins.less) y muchas consultas de medios con menos código típico en él, así que ... nada especial, y, en la medida en que no puedo ver duplicados – jebbie

Aquí hay dos posibles soluciones. Ambos parecen obvias, pero he pasado por alto dos de ellos a veces ...

¿Está viendo las reglas de estilo duplicadas en el archivo real CSS compilado? ¿O estás viendo reglas duplicadas en Firebug o en las herramientas de desarrollo de Chrome? Si es el segundo, regrese y asegúrese de que su archivo css en realidad tenga duplicados.
Tuve exactamente el mismo problema de duplicación al usar LESS, y no pude resolverlo hasta que me di cuenta de que había incluido el css dos veces en el <head>. Es un error tonto, pero definitivamente lo he hecho antes.

Buena suerte.

Fuente

2012-04-02 21:39:38 emersonthis

¡Resuelto! GRANDES GRACIAS A Emerson :) La segunda Solución fue el problema exacto en mi caso: la importación: @import "bootstrap/responsive.menos "; está incluyendo los archivos" variables.less "y" mixins.less "de nuevo - ya están incluidos en la primera importación de" bootstrap.less "-.- Así que, acabo de eliminar estas importaciones en responsive.less y ahora todo se ve bien :) – jebbie

Estoy feliz de haber ayudado. Cuando tienes la oportunidad, debes marcar la pregunta como resuelta. – emersonthis

Asegúrese de estar utilizando la última versión de LESS.

El comportamiento predeterminado de @import no solía ser muy inteligente si se le llamó varias veces desde diferentes archivos ..

Así la directiva @import-once se introdujo para asegurarse de que un menor de archivos en particular sólo se incluye una vez no importa cuántos archivos se usaron en.

Sin embargo, ahora han hecho que el comportamiento @import-once sea el predeterminado incluso si solo usa @import.

Ver también: what is the LESS CSS statement @import-once good for?

Fuente

2014-04-16 03:28:57

Respuesta

Cuestiones relacionadas