tasqyn tasqyn - 5 months ago 42
Ruby Question

NameError - uninitialized constant Sass::Engine:

I am getting NameError - uninitialized constant Sass::Engine: when I run my sinatra app with sass gem.
installed ruby version 2.3.1 with rbenv and also installed sinatra, sass gem.

require 'sinatra'
require 'slim'
require 'sass' # required sass
require 'sinatra/reloader' if development?

get '/styles.css' do
scss :styles #does not generate styles.css, styles.scss file is in /views folder
end

get '/' do
slim :home
end

get '/about' do
@title = "All About This Website"
slim :about
end

get '/contact' do
slim :contact #, :layout => :special
end

not_found do
slim :not_found
end

get '/fake_error' do
status 500
"There's nothing wrong, really :P"
end


Full error:


NameError - uninitialized constant Sass::Engine:
/home/tasqyn/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/tilt-2.0.5/lib/tilt/sass.rb:13:in
prepare'
/home/tasqyn/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/tilt-2.0.5/lib/tilt/template.rb:92:in
initialize'
/home/tasqyn/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/sinatra-1.4.7/lib/sinatra/base.rb:862:in
new'
/home/tasqyn/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/sinatra-1.4.7/lib/sinatra/base.rb:862:in
block in compile_template'
/home/tasqyn/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/tilt-2.0.5/lib/tilt.rb:104:in
block in fetch'
/home/tasqyn/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/tilt-2.0.5/lib/tilt.rb:103:in
fetch'
/home/tasqyn/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/tilt-2.0.5/lib/tilt.rb:103:in
fetch'
/home/tasqyn/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/sinatra-1.4.7/lib/sinatra/base.rb:841:in
compile_template'
/home/tasqyn/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/sinatra-1.4.7/lib/sinatra/base.rb:822:in
render'
/home/tasqyn/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/sinatra-1.4.7/lib/sinatra/base.rb:687:in
scss' main.rb:7:in `block in '


What I am doing wrong?

and here is styles.scss:

$red: #903;
$black: #444;
$white: #fff;
$main-font: Helvetica, Arial, sans-serif;

body {
font-family: $main-font;
}

h1 {
color: $red;
font: 32px/1 $main-font;
}

header h1 {
font-size: 40px;
line-height: 80px;
background: transparent url(/images/logo.png) 0 0 no-repeat;
padding-left: 84px;
}

@mixin tabs ($background: blue, $color: yellow) {
ul {
list-style: none;
margin: 0;
padding: 0;
background: $background;
overflow: hidden;
}

li {
float: left;
}

a {
text-decoration: none;
display: block;
padding: 8px;
background: $background;
color: $color;
&:hover {
background: darken($background, 20%);
}
}
}

nav {
@@include tabs($background: $black, $color: $white);
font-weight: bold;
}

p {
font: 13px/1.4 $main-font;
}

Answer

Make sure you have in your gemfile:

gem 'sass'
gem 'sass-rails'

If not, add it. Don't forget to run bundle install.