How To Install MDB with Laravel 5.8?


Topic: How To Install MDB with Laravel 5.8?

Logos123 asked 6 years ago

How can I install MDB in Laravel 5.8 using "npm require ..."


Mikołaj Smoleński staff answered 6 years ago

Hi there,

Here's our guide for Laravel Users:

MDBVUE LARAVEL HOW-TO:

  1. $ laravel new yourappname
  2. $ yarn add mdbvue
  3. $ yarn add -D babel-preset-stage-2
  4. in yourappname/resources/js/app.js add - this might seem v. tricky & weird* - import 'mdbvue/build/css/mdb.css';
  5. enhance a chosen blade template (default: "yourappname/resources/views/welcome.blade.php") with a) id="app" this is where our Vue instance will be mounted b) in the head so that the default BS styles can get attached c) in, say, lower part of the body so that our js goodies actually get there
  6. $ yarn dev it will compile both css and vue code into the output files we attached above
  7. $ php artisan serve now we should have a php server running (by default at localhost: 8000)

Best regards


siacomputacion commented 5 years ago

hello not found 'mdbvue/build/css/mdb.css


Mikołaj Smoleński staff commented 5 years ago

The paths have changed. Please check out our docs: https://mdbootstrap.com/docs/vue/getting-started/quick-start/#existing-project


I have followed the instructions to the letter but this type of errors appears and for more laps that I give I do not know how to solve it. I'm trying to implement mdb in an existing project that is made with laravel + vuejs + bootstrap and the idea is to integrate the power shown by mdbbotstrap, I have acquired the pro version. I have installed it by npm I have imported, I have used examples that are in your web and I appear errore like the following with the use of any element. select, checkbox, datatable, etc

The mistake is: VM2278 app.js: 67933 [Vue warn]: Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the "name" option.

Vue warn]: Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the "name" option.

Vue warn]: Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the "name" option.

[Vue warn]: Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the "name" option.


imyke answered 6 years ago

I think I understand the problem.

Vue.js is a front-end JavaScript framework, and it appears to be the package you purchased from MDB. That would account for the [Vue-warn] errors you're getting. Laravel, on the other hand, is a full-stack PHP framework that can be used as the back-end REST API of your Vue app.

You only need to follow the guide for Laravel users if:

  1. You don't plan to use Vue.js, rather a templating engine provided to Laravel
  2. You purchased the jQuery package from MDB

In your case, you should follow the Vue instructions at this page.

I hope this helps.


Mikołaj Smoleński staff commented 6 years ago

Thank for all Your suggestions. As I wrote here: https://mdbootstrap.com/support/vue/did-you-register-the-component-correctly-error/ we're planning to prepare a new article for Laravel users.

Best regards


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB Vue
  • MDB Version: 5.3.0
  • Device: Desktop
  • Browser: Chrome / FF
  • OS: Win 10
  • Provided sample code: No
  • Provided link: No