title: Rails: How do I properly avoid a circular dependency error with my CSS but still include all the files?
body: <p>I am new to Rails, and I'm hoping this is a simple question, but I haven't been able to find it here or by Googling around. I've been through <a href="https://stackoverflow.com/questions/7462661/sprocketscirculardependencyerror-in-storeindex">several</a> <a href="https://stackoverflow.com/questions/8803226/asset-pipeline-not-precompiling-sass">different</a> <a href="https://stackoverflow.com/questions/12327610/require-bootstrap-gets-sprocketscirculardependencyerror?lq=1">similar</a> <a href="https://stackoverflow.com/questions/8702687/circular-dependency-error-in-scss-file-in-rails-3-1-asset-pipeline">posts</a> but never fully fixed my issue. (The fourth link there, on "posts", is exactly the same problem, but it was never solved or answered.)</p>
  
  <p>I'm trying to set up a <em>very</em> simple blog application for playing with. All I want to do (for now) is establish a global application.css[.scss is optional] and a page specific post.css[.scss].</p>
  
  <p>My application.css looks like this:</p>
  
  <pre><code>//= require_self
  //= require_tree .
  
  body {
      background-color: #CCF;
  }
  #main_content_div {
      width:90%; 
      padding:10px; 
      margin: 15px auto; 
      background-color:#FFF;
  }
  </code></pre>
  
  <p>Pretty straightforward if you ask me.</p>
  
  <p>My post.css.scss looks like this:</p>
  
  <pre><code>.postlist_row {
      border: 1px solid red;
  }
  </code></pre>
  
  <p>Nothing fancy.</p>
  
  <p>But when I try to visit /posts, I wind up with:</p>
  
  <pre><code>Sprockets::CircularDependencyError in Posts#index
  </code></pre>
  
  <p>The standard SO answer to this seems to be "Well, just remove that require_tree statement. You're using Rails 3 and Sprockets, so that already happens and you're doubly including the same file(s)."</p>
  
  <p>This is probably true. And if I remove that require_tree, application.css works fine. However, and this is where my problem seems to differ from others, <strong>it never includes post.css.scss</strong>. None of the ruls in it are applied to the page, and it isn't shown in the source. </p>
  
  <p>I don't know enough yet about the pipeline to know for sure what the problem is, whether it's because of the order of my statements or because one is css and the other is scss or something with my configuration... I just have no idea.</p>
  
  <p>Any thoughts?</p>