2011-09-10 14 views
17

Estoy tratando de hacer referencia a una mezcla definida en un archivo (application.css.scss) en otro (home.css.scss). Intenté importar la aplicación en el hogar pero todavía recibo un error de "mixin indefinido".Compartiendo mixins entre archivos scss en rieles 3.1

¿Hay alguna manera de importar automáticamente todos mis archivos, o cuál es la mejor forma de administrar las importaciones entre archivos?

Respuesta

25

Todavía no he podido dar el salto a la versión 3.1, pero usando Compass & Sass durante bastante tiempo, he encontrado que es mejor tratar de administrar sass mixin/definition por separado de tu CSS actual que genera sass. De esta forma, los archivos mixin se pueden tratar libremente como bibliotecas de códigos, incluidos siempre que sea necesario, sin que generen reglas CSS repetidas veces.

lo que podría tener:

/* my-mixin-concern.scss */ 
$default_foo: 123px !default; 

@mixin some-concern($foo: $default_foo) { 
    // do something 
} 

/* application.scss */ 
$default_foo: 321px; // optionally, pre-set the default value before import. 
@import 'my-mixin-concern'; 
p { @include some-concern; } 

/* home.scss */ 
@import 'my-mixin-concern'; 
body.home p { @include some-concern(9000px); } 

De esta manera va a importar de forma explícita todos los requisitos para cada archivo SCSS, de manera similar a la forma en que lo haría en una biblioteca de código.

0

rieles solución pura

Paso 1. Cambiar el nombre de

application.css -> application.css.scss 

Paso 2. Refactor

// application.css.scss 

/* 
*= require_self 
*/ 

@import "mixins.css.csss" 
@import "project.css.scss" 
Cuestiones relacionadas