Sass with erb won't compile

Question

In Rails, file file.css.sass.erb:

.class-name
    width: <%= "10px" %>

Is throwing the error:

Invalid CSS after "": expected expression (e.g. 1px, bold), was "<%= "10px" %>"

Isn't it supposed to work?

Update 1

Still struggling with it, but I found that if I change it to SCSS syntax (filename and code), still it causes a very similar error.

Invalid CSS after " width: ": expected expression (e.g. 1px, bold), was "<%= "10px" %>;"

Although, if I remove the scss extension, leaving the CSS similar syntax with the filename file.css.erb, Rails does compile as expected.

Yet considering I'm forgetting something very obvious, I'm also considering this could be a gem conflict with sass-rails, or a bug, or something. After all, the code is working without SASS extensions.

Update 2

Just found other 4 unanswered questions on this same issue on:

1. scss.erb ruby code not executing
2. Assets not being run though the .erb preprocessor
3. Rails erb preprocessing not happening in development mode
4. sprockets sass partial erb extension.

Some of them ended up working around the problem by changing approaches. The ERB issue on SASS files remained untouched.

Answer 1

This is indeed a problem with sass-rails, as discussed on GitHub.

So this guy wrote this patch, which completely solves the problem.

The Solution

Add to Gemfile:

gem "sass_rails_patch", "~> 0.0.1"

then run bundle and you're good!

Answer 2

You can use asset helpers if the erb is only for referencing assets:

background-image: asset-url("rails.png")

...instead of...

background-image: url("<%= image_path('rails.png') %>");