vue-cli support

  1. MDB Home Page
  2. Support Main Page
  3. MDB Vue
Topic: vue-cli support

Leidos pro asked 6 years ago

do you support vue-cli? or do i simply copy the build dir into my existing project and import the css?

Filip Kapusta pro premium commented 6 years ago

Hello, you’ve just been granted access to our MDB Vue GitLab repository.

Mikołaj Smoleński staff answered 6 years ago

Hello Leidos, Yes, we do support Vue CLI. Here are the steps to add our MDB Vue package to Your existing project:
  1. vue init webpack my-project - to create new Vue CLI project
  2. cd my-project
  3. yarn add bootstrap
  4. yarn add font-awesome@4.7.0 --exact
  5. In package.json - "mdbvue": "http://git.mdbootstrap.com/mdb/vue/vu-dev.git" - it's for free version. For PRO You'll need to add here link from our gitlab repo
  6. yarn
  7. In main.js: import 'font-awesome/css/font-awesome.min.css' import 'bootstrap/dist/css/bootstrap.css' import 'mdbvue/build/css/mdb.css'
  8. Now You can import our components like this: import { Container, Row, Column, Btn, Card, CardBody, CardHeader, CardImg } from 'mdbvue';
Regards

Mikołaj Smoleński staff commented 6 years ago

If You have already working project You should begin from the 3 point

Leidos pro commented 6 years ago

thank you for the response. Currently I only have access to the JQuery pro version with gitLab. Can you please add mdbvue pro. This needs to be resolved ASAP as delays in support are now affecting project progression. Thank you.

dfiguero commented 6 years ago

Hey Mikolaj, thank you for these steps. I just started looking at MDB with Vue and I was wondering if there is an easier way to get it working with vue-cli? I have noticed other bootstrap+vue libraries only require one import (no need to import bootstrap/font-awesome separately) and also they do not require the individual components be imported individually but instead one can just say something similar to this inside main.js: import MDBVue from 'mdbvue' Vue.use(MDBVue) Is this something provided with the pro version? Thank you

Mikołaj Smoleński staff commented 6 years ago

Hey, we've prepared a quick start installation guide to make it easier. Please follow the steps from that page: https://mdbootstrap.com/vue/5-min-quick-start/ Best Regards

dfiguero commented 6 years ago

Thank you Mikołaj

Mikołaj Smoleński staff commented 6 years ago

No problem. If You have more questions I am ready to help You.

Victor Raji answered 5 years ago

In package.json - "mdbvue": "http://git.mdbootstrap.com/mdb/vue/vu-dev.git" - it's for free version.

please what do you mean in that step 5.? should I edit the package.json?? pls explain

Mikołaj Smoleński staff commented 5 years ago

The latest versions are working via NPM - it's the easiest way to install our package.

You just need to type the following expression in Your terminal: 'yarn add mdbvue'

Best regards
Write
Create snippet
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: Pro
  • Premium support: No
  • Technology: MDB Vue
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
About author
Leidos
Pro User
0Support score
2Questions 0Answers
0Snippets likes 0Snippets