Buefy components are not working...

Published 8 months ago by Ibe

Hi there, I am having a problem with calling the components of buefy and I just can't figure out what's wrong with it... Anybody knows how I can solve this?

VERSIONS: Vue: "2.5.7" Buefy: "0.6.3"


  • in my app.js file:

window.Vue = require('vue');
import Buefy from 'buefy';


 var app = new Vue({
  el: '#app',
   data: {}
  • In my app.scss file:
// Variables
@import "variables";

// Font Awesome
@import "node_modules/font-awesome/scss/font-awesome";

// Bulma
@import "node_modules/bulma/bulma";

// Bulma Vue Modules
@import "node_modules/buefy/src/scss/buefy";
  • in my login.blade.php file:


        <div class="field">

  • in my app.blade.php file :
<!DOCTYPE html>
<html lang="{{ app()->getLocale() }}">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- CSRF Token -->
    <meta name="csrf-token" content="{{ csrf_token() }}">

    <title>{{ config('app.name', 'Laravel') }}</title>

    <!-- Styles -->
    <link href="{{ asset('css/app.css') }}" rel="stylesheet">


    <div id="app">

    <!-- Scripts -->
    <script src="{{ asset('js/app.js') }}"></script>

STEPS TO REPRODUCE: After using any of the components nothing is working.

EXPECTED BEHAVIOR: Expected to render a checkbox

ACTIAL BEHAVIOR: Doesn't render anything

Please sign in or create an account to participate in this conversation.