Js-beautify: Agregar o conservar una línea vacía entre las reglas CSS

Creado en 20 may. 2014  ·  16Comentarios  ·  Fuente: beautify-web/js-beautify

Perdóneme si esto se ha preguntado antes, pero ¿hay alguna manera de mantener el espacio entre las reglas CSS al formatear?

.login {
    margin-top: 30px;
    padding: 30px;
    background: rgba(255, 255, 255, 0.7);
}

.login.btn {
    border-radius: 0;
    background-color: #5C6166;
    border-color: #4a4a4a;
}

Para:

.login {
    margin-top: 30px;
    padding: 30px;
    background: rgba(255, 255, 255, 0.7);
}
.login.btn {
    border-radius: 0;
    background-color: #5C6166;
    border-color: #4a4a4a;
}
css enhancement

Comentario más útil

Esto sería genial. Ojalá js-beautify obedeciera sass-lint más explícita, pero esta es la única característica que me está dando muchos problemas.

Todos 16 comentarios

+1

+1

+1

Hay una opción llamada "end_with_newline", pensé que esto agrega una nueva línea entre bloques, pero simplemente pone una línea vacía al final del archivo: - /

Espero que esto se solucione, me encanta embellecer, pero este problema (por tonto que parezca) es un factor decisivo para mí.

He solucionado esto, al menos para documentos CSS simples, agregando una nueva línea después de cada}

vaya a \ Paquetes \ HTML-CSS-JS Prettify \ scripts \ node_modules \ js-beautify \ js \ lib \ beautify-css.js
Encuentre esta sección de código:

print["}"] = function (ch) {
            print.newLine();
            output.push(ch);
            print.newLine();
        };

y cámbialo a

print["}"] = function (ch) {
            print.newLine();
            output.push(ch);
            print.newLine();
            output.push('\n');
        };

@ Atid-G, ¡eso es genial! Proporcione una solicitud de extracción con las pruebas (y el puerto de Python).

Creo que la solución de @ Atid-G no será suficiente. En una propiedad anidada, no es necesario agregar una nueva línea después del corchete de cierre. Sé que es por menos / scss, pero creo que esto también se usa para embellecer esos idiomas.

Ejemplo :

.rule-1 {
    display: block;

    .rule-2 {
        float: left;
    } // New line needed after this bracket

    .rule-3 {
        display: none;
    } // No new line needed
}

@drewhamlett , acabo de realizar una fusión, pero no estoy seguro de que aborde completamente lo que querías aquí. ¿Podrías echar un vistazo?

Como dice @bitwiseman , esta mejora está cubierta en https://github.com/beautify-web/js-beautify/pull/574 pull request.
Compruébalo y cierra este problema.

Esperando la próxima versión ...

De acuerdo, voy a llamar a esto bueno y podemos reabrir si resulta que no es así.

Como dijo @malexandre , ¿sería posible agregar nuevas líneas dentro de las propiedades anidadas? Todo parece apiñado con descaro y el linter también se queja. Tengo consultas de medios anidadas en muchas propiedades, por lo que es bastante difícil de leer.

@nevace , parece que estás hablando de un tema diferente. Abra un nuevo problema con un ejemplo de entrada, salida actual y salida deseada. Incluya cualquier configuración pertinente.

¿Esto ha sido arreglado?

@bitwiseman : Abrí el nuevo boleto yo mismo porque creo que es muy relevante # 1258.

Esto sería genial. Ojalá js-beautify obedeciera sass-lint más explícita, pero esta es la única característica que me está dando muchos problemas.

¿Fue útil esta página
0 / 5 - 0 calificaciones