title: How do I use SASS the "normal way" with vue.js?
body: <p>Up till now, I've used sass together with Grunt, the result being that I compile x .scss files into style.css.</p>
  
  <p>I've only done one project in React and it's my first time working with Vue.js, so there a a few things I'm trying to understand.</p>
  
  <p>If I want to include css styling in the same file as my Vue component, I can simply use </p>
  
  <pre><code>&lt;style lang="sass"&gt;
     @import '_card.scss'
    // Custom CSS code here
  &lt;/style&gt;
  </code></pre>
  
  <p>From what I understand, Vue takes all the styling from all the .vue files and compiles it into style.css. But since I'm not sure, I ask this;</p>
  
  <ol>
  <li><p>Are Vue components called in runtime and does that mean that specific parts of styling is compiled instead of loading all styling in one file?</p></li>
  <li><p>I'm not a big fant of putting styling inside Vue component files. How can I load global styles? If I remember correctly, I had to load the css file in each React component and I don't see the point in this. I just want to load the style in the header.</p></li>
  </ol>