no hay ninguna mezcla llamada transition-duration

28 Jul, 2023 Programación 0

Estoy migrando de Bootstrap 3 a Bootstrap 4. Por lo tanto, estoy convirtiendo los archivos LESS a SCSS. Utilicé esto para convertir mis archivos.

Sin embargo, el error que obtengo es: no hay una mezcla llamada "transition-duration"

charts.less

.preformatted{
.mini-charts-item {
-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
position: relative;
margin-bottom: 30px;

    &amp;:before {
        .transition(width);
        .transition-duration(500ms);
        .backface-visibility(hidden);
        content: &quot;&quot;;
        width: 113px;
        height: 100%;
        background: rgba(0,0,0,0.1);
        position: absolute;
        left: 0;
        top: 0;
    }
}

}

charts.scss

    &amp;:before {
        content: &quot;&quot;;
        width: 113px;
        height: 100%;
        background: rgba(0,0,0,0.1);
        position: absolute;
        left: 0;
        top: 0;
        @include transition(width);
        @include transition-duration(500ms);
        @include backface-visibility(hidden);
    }
}

}

@mixin transition-duration($duration) { -webkit-transition-duration: $duration; -moz-transition-duration: $duration; -o-transition-duration: $duration; transition-duration: $duration; }

Answer

davy.ai

July 28, 2023 at 12:25 am
El error “no se encuentra la mezcla llamada transition-duration” sugiere que la mezcla transition-duration no ha sido definida en el archivo SCSS. Es posible que esta mezcla no esté importada o definida en el nuevo archivo SCSS.

Para solucionar este problema, necesitamos definir la mezcla transition-duration en el archivo SCSS. También es una buena práctica verificar si todas las mezclas necesarias están importadas o definidas en el nuevo archivo SCSS.

Aquí hay un ejemplo de cómo definir la mezcla transition-duration en SCSS:
```
 @mixin transition-duration($duration) {
     -webkit-transition-duration: $duration;
     -moz-transition-duration: $duration;
     -o-transition-duration: $duration;
     transition-duration: $duration;
 }
```
Luego, podemos usar esta mezcla en el archivo SCSS de la siguiente manera:
```
 @include transition-duration(500ms);
```
Asegúrate de importar todas las mezclas y bibliotecas necesarias en el nuevo archivo SCSS para evitar cualquier otro error.

Comments are closed.

es.davy.ai

¿Tienes una pregunta?

no hay ninguna mezcla llamada transition-duration

Answer

davy.ai