opoloo / lines-engine

Lines is a customizable blog framework for Rails. It aims at making publishing simple and beautiful.
http://lines.opoloo.com
GNU Lesser General Public License v3.0
216 stars 102 forks source link

Compatibility issues with sprockets and SASS @import #7

Closed ekremkaraca closed 5 years ago

ekremkaraca commented 7 years ago

Hey guys!

I installed your gem and configured with default values to give it a try on Rails 5 with Postgresql 9.5. After setup, when I hit blog page, I got error mentioned on title. Here are full log:

❯ rails s
=> Booting Puma
=> Rails 5.0.0.1 application starting in development on http://localhost:3000
=> Run `rails server -h` for more startup options
Puma starting in single mode...
* Version 3.6.0 (ruby 2.3.1-p112), codename: Sleepy Sunday Serenity
* Min threads: 5, max threads: 5
* Environment: development
* Listening on tcp://localhost:3000
Use Ctrl-C to stop
Started GET "/blog/login" for 127.0.0.1 at 2016-11-08 18:56:00 +0300
  ActiveRecord::SchemaMigration Load (0.5ms)  SELECT "schema_migrations".* FROM "schema_migrations"
Processing by Lines::SessionsController#new as HTML
  Rendering /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/lines-engine-1.2.1/app/views/lines/sessions/new.html.erb within layouts/lines/admin
  Rendered /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/lines-engine-1.2.1/app/views/lines/sessions/new.html.erb within layouts/lines/admin (20.9ms)
Completed 500 Internal Server Error in 1154ms (ActiveRecord: 0.0ms)

ActionView::Template::Error (Undefined variable: "$max-width".):
    16:   <script type="text/javascript" src="/codemirror/mode/markdown/markdown.js"></script>
    17:   <script type="text/javascript" src="/codemirror/mode/gfm/gfm.js"></script>
    18:   <!-- Codemirror End -->
    19:   <%= stylesheet_link_tag    "lines/admin/admin", media: "all" %>
    20:   <%= javascript_include_tag "lines/admin/admin" %>
    21:   <%= csrf_meta_tags %>
    22:   <%= yield(:head) %>

app/assets/stylesheets/lines/article.scss:2
  Rendering /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/template_error.html.erb within rescues/layout
  Rendering /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_source.html.erb
  Rendered /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_source.html.erb (8.3ms)
  Rendering /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_trace.html.erb
  Rendered /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_trace.html.erb (4.6ms)
  Rendering /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_request_and_response.html.erb
  Rendered /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_request_and_response.html.erb (0.8ms)
  Rendered /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/template_error.html.erb within rescues/layout (30.8ms)
Started GET "/blog/" for 127.0.0.1 at 2016-11-08 18:56:07 +0300
Processing by Lines::ArticlesController#index as HTML
  Lines::Article Load (0.9ms)  SELECT  "lines_articles".* FROM "lines_articles" WHERE "lines_articles"."published" = $1 ORDER BY featured DESC, published_at DESC, created_at DESC LIMIT $2  [["published", true], ["LIMIT", 1]]
  Rendering lines/articles/index.html.erb within layouts/lines/application
  Rendered lines/articles/index.html.erb within layouts/lines/application (60.6ms)
Completed 500 Internal Server Error in 188ms (ActiveRecord: 2.3ms)

ActionView::Template::Error (Undefined variable: "$max-width".):
    1: <div class="rss">
    2:     <%= link_to image_tag("ic_rss.png"), articles_url(format: "atom") %>
    3: </div>
    4: 
    5: <div id="articles">

app/assets/stylesheets/lines/article.scss:2
app/views/lines/articles/index.html.erb:2:in `_app_views_lines_articles_index_html_erb__1708563076889334612_70086469085360'
  Rendering /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/template_error.html.erb within rescues/layout
  Rendering /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_source.html.erb
  Rendered /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_source.html.erb (7.7ms)
  Rendering /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_trace.html.erb
  Rendered /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_trace.html.erb (2.6ms)
  Rendering /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_request_and_response.html.erb
  Rendered /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_request_and_response.html.erb (0.7ms)
  Rendered /home/ekrem1610/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/template_error.html.erb within rescues/layout (27.0ms)
^CExiting
npmachine commented 7 years ago

The rails default application.css tried to load entire scss files in assets/stylesheets/lines folder based on *= require_tree . while stylesheet/lines/application.scss(lines default stylesheet) has responsibility to load other scss files.

So, changing rails default application.css like this would solve the problem:

*= lines/application
* require_tree .
* require_self
NishantUpadhyay-BTC commented 7 years ago

Here is how I fix this issue,

I imported module of variables in each file wherever I was facing that error. @import 'variables_and_mixins'; add this line to all your css files which are using those variables in css like article.scss, footer.scss, general.scss etc...

thej commented 7 years ago

Mixing SASS @import with sprockets' //require will not work out of the box. You could also try to remove sprockets syntax from your master stylesheet and replace it with SASS @import syntax. There's also the sprockets-sass gem that could solve the issue. I'll adress this in one of the future releases of lines.

NishantUpadhyay-BTC commented 7 years ago

Remove all content from main css manifest file stylesheets/application.scss and just write @import 'lines/application' in it. This works for me now. Remove require_tree and require_self .

edgarlepe commented 7 years ago

Just removing the line

 *= require_tree .

should be fix the issue. So you're left with something like:

 *= require lines/application
 *= require_self
stvauyeung commented 6 years ago

I was able to resolve the issue in my Rails 5 app by moving 'assets/stylesheets/lines' to 'vendor/lines' and adding *= vendor/lines/application to the application.css file.