title: How to use external scss files in NativeScript-Vue
body: <p>I have 2 external I want to use in my <code>Nativescript-Vue</code> files.</p>
  
  <p>They are located in the following directory <code>/app/styles/_variables.sccs</code> and <code>/app/styles/generalStyles.scss</code>. </p>
  
  <p>I import <code>_variables.sccs</code> in <code>generalStyles.sccs</code>.</p>
  
  <p>But when I want to import <code>generalStyles.sccs</code> in my Vue file it gives me the following error:</p>
  
  <blockquote>
    <p>SassError: File to import not found or unreadable: styles/generalStyles.
            on line 277 of app/components/Select/StationSelect.vue</p>
    
    <blockquote>
      <p>@import "styles/generalStyles";</p>
    </blockquote>
  </blockquote>
  
  <p>StationSelect.vue looks like this</p>
  
  <pre><code>&lt;style lang="scss" scoped&gt;
  
      @import "styles/generalStyles";
  
      .routeDetailsChoice,
      .timeDetails{
          Label,
          TextField{
  
              .ns-dark &amp;{
                  color: $white;
              }
          }
      }
  &lt;/style&gt;
  
  </code></pre>
  
  <p>I have also the following packages:</p>
  
  <pre><code>"nativescript-vue": "2.4.0",
  "node-sass": "^4.13.0",
  "sass-loader": "^8.0.1",
  "style-loader": "^1.1.3",
  </code></pre>