title: Where to Vue.use custom component on Quasar Framework?
body: <p>I tried to use <a href="https://github.com/phanan/vue-facebook-signin-button" rel="nofollow noreferrer">https://github.com/phanan/vue-facebook-signin-button</a> component on Quasar Framework, I've installed it using npm:</p>
  
  <pre><code>npm i vue-facebook-signin-button --save
  </code></pre>
  
  <p>I've put on <code>main.js</code>:</p>
  
  <pre><code>import FBSignInButton from 'vue-facebook-signin-button'
  Vue.use( FBSignInButton ) // use facebook signin button
  </code></pre>
  
  <p>Then I've add on main <code>.vue</code> file: </p>
  
  <pre><code>&lt;template&gt;
    &lt;q-layout&gt;
      &lt;div class="layout-view"&gt;
        &lt;fb-signin-button
          :params="fbSignInParams"
          @success="onFbSignInSuccess"
          @error="onFbSignInError"&gt;
          Sign in with Facebook
        &lt;/fb-signin-button&gt;
      &lt;/div&gt;
     &lt;/q-layout&gt;
   &lt;/template&gt;
  &lt;script&gt;
    // Facebook
    var FB;
    window.fbAsyncInit = function() {
      FB.init( {
        appId: process.env.FB_APPID,
        cookie: true,  // enable cookies to allow the server to access the session
        xfbml: true,  // parse social plugins on this page
        version: 'v2.8' // use graph api version 2.8
      } )
    }
    (function( d, s, id ) {
      var js, fjs = d.getElementsByTagName( s )[ 0 ];
      if( d.getElementById( id ) ) return;
      js = d.createElement( s );
      js.id = id;
      js.src = "//connect.facebook.net/en_US/sdk.js";
      fjs.parentNode.insertBefore( js, fjs );
    }( document, 'script', 'facebook-jssdk' ))
  
    export default {
      store,
      data () {
        return {
          fbSignInParams: {
            scope: '',
            return_scopes: true
          }
        }
      },
      computed: {},
      methods: {
        onFbSignInSuccess ( response ) {
          console.log( 'res', response )
          FB.api( '/me', dude =&gt; {
            console.log( 'dude', dude )
            console.log( `Good to see you, ${dude.name}.` )
          } )
        },
        onFbSignInError ( error ) {
          console.log( 'OH NOES', error )
        }
      }
    }
  &lt;/script&gt;
  </code></pre>
  
  <p>But it gives an runtime error:</p>
  
  <pre><code>(unknown) [Vue warn]: Unknown custom element: &lt;fb-signin-button&gt; - did you register the component correctly? For recursive components, make sure to provide the "name" option.
  
  found in
  
  ---&gt; &lt;Index&gt; at /home/asd/SPA/src/components/Index.vue
         &lt;App&gt; at /home/asd/SPA/src/App.vue
           &lt;Root&gt;
  </code></pre>
  
  <p>And another error on <code>fbAsyncInit</code>:</p>
  
  <pre><code>sdk.js:96 Uncaught TypeError: Cannot read property 'init' of undefined
      at window.fbAsyncInit (eval at &lt;anonymous&gt; (0.6374f77….js:243), &lt;anonymous&gt;:10:5)
      at v.__wrapper (sdk.js:96)
      at sdk.js:140
  </code></pre>