ruby on rails - Requerir declaración en application.css.scss

ruby-on-rails sass

Question

Quiero usar una gema de lightbox como fancybox o caja de color. Ambas gemas piden agregar esta línea en la aplicación.css

 *= require colorbox-rails

Aquí está el problema. Sólo tengo archivos de aplicaciones.css.scss. Todos mis archivos css son archivos scss. Tengo sentencias de importación en application.css.scss pero no * = necesito sentencias. Añadiendo los resultados de la línea anterior en el error:

CSS no válido después de "*": se esperaba "{", era "= requiere colorb ..."

Aquí está la aplicación completa.css.scss

@import "bootstrap";
@import "welcome";
@import "sessions";
@import "users";


*= require colorbox-rails

Answer 1

De manera explícita, tuve este problema con los archivos de fuentes que declaraban diferentes tipos de letra con un solo archivo font.scss en mi directorio de hojas de estilo (la aplicación Rails con sass y haml). Había seguido problemas relacionados (como este artículo en SO ) y había intentado varias soluciones relacionadas como eliminar ''-'' del nombre de archivo de fuente ttf, cambiar las declaraciones de url en el archivo font.scss, etc.

La solución de @ joshua.paling me funcionó ...

1. Cambie el nombre del archivo font.scss a font.css

2. Utilice el siguiente estilo de declaración en el archivo application.scss:

   /* ...    
   *= require_self    
   *= require fonts    
   */
   # @import other files here excluding the font.css file

Y con esta configuración, las siguientes declaraciones de fuentes tipográficas aún funcionaron.

 @font-face {
   font-family: PT Serif;
   src: url(''PT_SerifWebRegular.ttf'') format("truetype");
 }

Answer 2

application.css.scss o application.css son algo iguales. Simplemente cambie el nombre de su application.css a application.css.scss .

En cuanto a agregar esa línea, tendrá que estar en la parte superior, en un comentario. Me gusta esto:

/*
 * This is a manifest file that''ll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
 *
 * You''re free to add application-wide styles to this file and they''ll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any styles
 * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
 * file per style scope.
 *
 *= require_self
 *= require colorbox-rails
 */

@import "bootstrap";
@import "welcome";
@import "sessions";
@import "users";