Less.js: Cómo manejar las matemáticas de unidades mixtas

Creado en 9 abr. 2017  ·  6Comentarios  ·  Fuente: less/less.js

div {
    <strong i="5">@value</strong>: 1px;
    a: <strong i="6">@value</strong> * 1rem;       // 1px  - ok
    b: <strong i="7">@value</strong> * 1px * 1rem; // 1px  - ok
    d: <strong i="8">@value</strong> / 1px;        // 1px  - ok
    c: <strong i="9">@value</strong> / 1px * 1rem; // 1rem - unexpected
    e: <strong i="10">@value</strong> / 1px + 0rem; // 1rem - unexpected
}

c y d anteriores se contradicen con http://lesscss.org/features/#features -overview-feature-operations que indican que el resultado debe tener una unidad de expresión situada más a la izquierda (es decir, todas las expresiones arriba debería producir 1px ). Las pruebas cubren solo la expresión a / b / c que produce accidentalmente el resultado esperado.
Relacionado con # 2418 y # 2472.

bug needs decision

Comentario más útil

Honestamente, nunca me ha gustado poder mezclar unidades en Less. No tiene sentido desde una perspectiva matemática y, como usted señala, todo se basa en el orden de evaluación ... lo que tampoco tiene sentido.

Sin embargo, cuando miré el código strictUnits , tampoco tenía sentido para mí. Eso tampoco parece hacer lo que pensé que haría.

Entonces, sí, eso es extraño, pero no estoy dispuesto a verlo arreglado. Me inclino más a que desaparezcan las matemáticas de unidades mixtas. Pero ese soy solo yo. Como el resultado de 1px * 1px debería ser 1px^2 (no es útil, pero es cierto). Y el resultado de 1px / 1px debería ser 1 . Sass es demasiado complejo sobre algunos tipos de matemáticas, pero usa principios matemáticos básicos para hacer cosas como cambiar unidades de unidades mixtas. Por ejemplo.

<strong i="13">@value</strong> / 1px * 1rem
La matemática aquí es 10px / 1px . Esto debería producir 1 (no en Less, solo en principio, y lo haría en Sass). 1 * 1rem = 1rem . Sin ofender a Alexis en los orígenes de esta función, pero elegir la primera unidad de una expresión es un poco extraño, difícil de evaluar y puede llevar a estos casos de borde con errores.

Solo mis $ 0.02.

Todos 6 comentarios

Honestamente, nunca me ha gustado poder mezclar unidades en Less. No tiene sentido desde una perspectiva matemática y, como usted señala, todo se basa en el orden de evaluación ... lo que tampoco tiene sentido.

Sin embargo, cuando miré el código strictUnits , tampoco tenía sentido para mí. Eso tampoco parece hacer lo que pensé que haría.

Entonces, sí, eso es extraño, pero no estoy dispuesto a verlo arreglado. Me inclino más a que desaparezcan las matemáticas de unidades mixtas. Pero ese soy solo yo. Como el resultado de 1px * 1px debería ser 1px^2 (no es útil, pero es cierto). Y el resultado de 1px / 1px debería ser 1 . Sass es demasiado complejo sobre algunos tipos de matemáticas, pero usa principios matemáticos básicos para hacer cosas como cambiar unidades de unidades mixtas. Por ejemplo.

<strong i="13">@value</strong> / 1px * 1rem
La matemática aquí es 10px / 1px . Esto debería producir 1 (no en Less, solo en principio, y lo haría en Sass). 1 * 1rem = 1rem . Sin ofender a Alexis en los orígenes de esta función, pero elegir la primera unidad de una expresión es un poco extraño, difícil de evaluar y puede llevar a estos casos de borde con errores.

Solo mis $ 0.02.

Creo que lo que debería suceder es que, al igual que los cambios en las matemáticas, hay un cambio en las unidades mixtas para que haya una tercera opción entre las dos:

  1. strictUnits: false - intentar hacer unidades matemáticas y coercitivas
  2. strictUnits: ? - por ejemplo 1px / 1px // output 1 , 100vh - 10px // output 100vh - 10px es decir, con unidades mixtas, deje la expresión como está y la salida - útil para sub-expresiones asignadas a vars y utilizadas en calc () - futuro incumplimiento?
  3. strictUnits: true - arroja un error (no veo cómo esto es útil).

El problema no se trata de opiniones personales sobre el manejo de unidades / aritmos. Se trata de que el compilador no siga su propia documentación. (Para el resto, consulte, por ejemplo, https://github.com/less/less.js/issues/1366#issuecomment-342361948).

El problema no se trata de opiniones personales sobre el manejo de unidades / aritmos. Se trata de que el compilador no siga su propia documentación.

Sí, lo entiendo. Pero, en última instancia, se trata de cómo "arreglarlo", ¿verdad? Así que solo digo de manera indirecta que no creo que valga la pena arreglar esto, sino que debería tener un comportamiento más intuitivo. Pero sí, esa es mi opinión, hombre.

@ seven-phase-max Solo una nota: he reescrito la mayoría de los métodos de operación para las unidades, y de hecho tuvieron algunas acrobacias extrañas para determinar la unidad final. Logré que sea mucho más sencillo donde la unidad del lado izquierdo gana cuando se pasa la opción de coaccionar a las unidades.

(Hubo algunos hilos en los que hubo opiniones diferentes sobre posibles mejoras de unidades estrictas, pero como eso se extendió por todo el rastreador (o al menos no puedo encontrar un hilo dedicado rápidamente), supongo que simplemente sueno la parte clave de :)
Mi opinión personal sobre

StrictUnits:? - por ejemplo, 1px / 1px // salida 1, 100vh - 10px // salida 100vh - 10px

es algo así como: no valdría la pena (debido a la relación resultado / esfuerzo). En otras palabras, no hay nada que mejorar en realidad (excepto simplemente corregir los errores obvios como el anterior).

Tenga en cuenta que para que sea realmente genérico (en oposición a codificar estos valores / patrones de operaciones / ejemplos minimalistas) necesitará manejar adecuadamente todas las igualdades aritméticas habituales y, por lo tanto, introducir unidades "imaginarias" como px² y similar. Por ejemplo, para a: 1px; b: 2px; c: 4px; un resultado esperado de a*b/c (obviamente aceptando (a*b)/c = a*(b/c) ) sería .5px lo que significa que el resultado de a*b tiene que ser 2px² (al menos internamente).

Hay otras preocupaciones de implementación (obviamente, parecería extraño contar también cosas como 1/1hz = 1s etc. pero formalmente ...) Contando en centavos: había dicho que CSS Units es demasiado grande para pincharlo sin una razón (" solo porque algo como 1px/1px = 1 parece intuitivo").

StrictUnits: true: arroja un error (no veo cómo esto es útil).

Básicamente, si a uno no le gusta la propagación de unidades y / o las unidades mixtas, puede introducir un estilo de codificación más estricto que no permita dicha aritmética (por lo tanto, el actual strictUnits: true es básicamente una opción para forzar este estilo de codificación).

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