Стили CSS не скомпилированы для ресурсов Rails

Question

У меня есть следующая настройка с моими таблицами стилей в приложении Rails 3.2. У меня есть файл application.css со многими определенными в них стилями и несколькими другими файлами для более конкретных стилей, например, все, что связано с нижним колонтитулом, находится в footer.css.

В разработке все работает, но в процессе производства ни один из мобильных стилей в необходимых файлах не скомпилирован, а все выше строки @media only screen and (min-width: 768px) для каждой таблицы стилей.

В главном файле application.css имеется около 700 строк стилей, после чего у него также есть медиа-запрос @media only screen and (min-width: 768px). Внутри медиа-запроса около 700 строк, перекрывающих предыдущие 700 строк стилей для настольных компьютеров. Однако эти стили успешно скомпилированы. Я не понимаю, почему требуемые файлы работают не так.

application.css

*= require_self 
*= require base.css 
*= require footer.css 

.benefit { 
    display: block; 
    font-size: 0.8em; 
    margin: 1em; 
} 

@media only screen and (min-width: 768px) { 
    .benefit { 
    font-size: 1em; 
    margin: 3em; 
    } 
} 

# All above styles compile 

Base.css

header, section, footer, 
aside, nav, article, figure { 
    display: block; 
} 

html, body { 
    height: 100%; 
    background: #DEDEDE; 
} 

# Above styles don't compile 

@media only screen and (min-width: 768px) { 

# Below style does compile 

    body { 
     text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2); 
    } 

} 

footer.css

footer { 
    background: #ffffff; 
    width: 100%; 
} 

# Above style doesn't compile 

@media only screen and (min-width: 768px) { 

# Below style does compile 

    footer { 
     background: none repeat scroll 0 0 #000; 
     color: #818A8A; 
     padding: 0; 
    } 
} 

Редактировать: Я попытался явно добавить мобильные стили css-файлов в свои собственные медиа-запросы, как было предложено в this answer и обновленном коде, но это не сработало.

footer.css

@media only screen { 
    footer { 
    background: #ffffff; 
    width: 100%; 
    } 
} 

# Above style STILL doesn't compile 

@media only screen and (min-width: 768px) { 

# Below style does compile 

    footer { 
     background: none repeat scroll 0 0 #000; 
     color: #818A8A; 
     padding: 0; 
    } 
} 

Answer 1

С более чем 1000 строк стиля, вы обязательно опустили с запятой или фигурную скобку где-то вдоль линии. Как указано в комментарии d_ethier, один из способов тестирования заключается в компиляции с флагом --trace, но ваша компиляция будет терпеть неудачу, если активы являются простыми файлами CSS.

Что вы хотите сделать, это включить sass-rails в ваш Gemfile и переименовать ваши таблицы стилей в scss-файлы, чтобы при возникновении каких-либо ошибок они приведут к сбою компиляции и выделит вашу проблему. Временно переместить стили из файла application.css в другой файл (скажем all.css.scss), а также:

application.css:

*= require_self 
*= require all.css.scss 
*= require base.css.scss 
*= require footer.css.scss