title: vue.config.js to (laravel) webpack.mix.js
body: <p>I started using Vue using the Vue CLI template. In that template you create a file called 'vue.config.js' to define some settings. More to find here: <a href="https://cli.vuejs.org/guide/css.html#css-modules" rel="noreferrer">https://cli.vuejs.org/guide/css.html#css-modules</a> </p>
  
  <p>I had a settings for an global css/sass file so all my components could access the variables (the file only contains vars).</p>
  
  <p>vue.config.js:</p>
  
  <pre class="lang-js prettyprint-override"><code>module.exports = {
      // So we can use the template syntages in vue components (correct me if am wrong)
      runtimeCompiler: true,
      // CSS settings
      css: {
          loaderOptions: {
              sass: {
                  // Load in global SASS file that we can use in any vue component and any sass file
                  data: `
                    @import "@/assets/css/variables.scss";
                  `
              }
          }
      }
  };
  </code></pre>
  
  <p>Now I am working on another project. This time I use laravel and vue in one app. Laravel makes Vue works with webpack and webpack.mix.js.</p>
  
  <p>Now here is where I get stuck. I can't create a config so the global css file with the variables can be recognises in the vue "one file components"  I can't find any solution on the internet or my own experience to make this work.</p>
  
  <p>Anyone experience with this?</p>