How to fix SCSS compilation error in Rails 4.1?

Question

Ruby on Rails

Hello.
The structure is like this:

application.css.scss
_vars.css.scss
sizes/
  _mobile.css.scss
  _desktop.scss.scss

In the application, everything else is connected via ' @import '. First, a file with variables, then files for the mobile and desktop versions. So the compiler swears that variables are not defined in mobile and desktop styles. How to treat?

# application.css.scss
@import 'bootstrap';
@import 'font-awesome';
@import 'videojs/dist/video-js/video-js.css.scss';

@import 'vars';
@import 'sizes/mobile';
@media (min-width: 992px) { @import 'sizes/desktop'; }

# Ошибка
Sass::SyntaxError: Undefined variable: "$body_nav_padding".
(in app/assets/stylesheets/application/sizes/_mobile.css.scss:2)

Answer 1

The jamb was in this line:
Removed the redundant and earned:

Rails.application.config.assets.precompile << /\.(?:svg|eot|woff|ttf|swf)$/

Answer 2

you should only compile application.css.scss
compilers are trying to separately compile the files that you include
in the assets in the config, you need to specify what to compile