MDB Vue - Frequently Asked Questions
Click below for responses to frequently asked questions.There are several ways to do it:
Vue CLI plugin - simply run
vue add mdb
in your console in your Vue project directory and follow the instructionsMDB ZIP file - you can download the zip package and include simply modify it to your needs, as it already includes the required routing and components presentation.
NPM - you can install it using npm as a module (if will be installed under the
node_modules
folder).
You can find the installation steps for both options here.
Sure there is! You will need an account at our git server (if as a PRO user you don't have one, please contact us via contact@mdbootstrap.com). Once you have access, simply follow our 5 min quick start.
It is fairly simple. If you are using
yarn
, just replace
npm install
with
yarn add
:
1. First, install Vue, if you have not already.
npm install --global vue-cli
vue init webpack <YOUR-PROJECT-NAME-HERE>
cd <YOUR-PROJECT-NAME-HERE>
npm install
npm run dev
2. Create your Heroku app
heroku create <YOUR-PROJECT-NAME-HERE>
Now, an URL to your project should be created (say,
https://<YOUR-PROJECT-NAME-HERE>.herokuapp.com
. To ensure that the service does not install any unnecessary
dependencies, toggle the
NODE_ENV
to
production
:
heroku config:set NODE_ENV=production --app <YOUR-PROJECT-NAME-HERE>
3. Create a server.js: download Express.js:
npm install express --save
...and add a
server.js
file to project's root directory:
// server.js
var express = require('express');
var path = require('path');
var serveStatic = require('serve-static');
app = express();
app.use(serveStatic(__dirname + "/dist"));
var port = process.env.PORT || 5000;
app.listen(port);
console.log('server started '+ port);
The app will be served from the
/dist
directory, which gets populated after build process is finished:
npm run build
To see how things stand, type:
node server.js
You should see your project being served at http://localhost:5000. Heroku starts the apps using the
start
script in project's
package.json
, so be sure to replace the original one with
server.js
:
// package.json
{
"name": "<YOUR-PROJECT-NAME-HERE>",
"version": "1.0.0",
"description": "A Vue.js project",
"author": "",
"private": true,
"scripts": {
"dev": "node build/dev-server.js",
"build": "node build/build.js",
"start": "node server.js", <--- EDIT THIS LINE HERE
...
4. Create a git repository and set Heroku as its remote:
git init
heroku git:remote --app <YOUR-PROJECT-NAME-HERE>
Remove the
/dist
directory from your
.gitignore
file and commit the changes:
git add . && git commit -a -m "Adding files."
5. Push it and hack on!
git push heroku master
Now, your project should be available at
https://<YOUR-PROJECT-NAME-HERE>.herokuapp.com
. Create, tweak, commit and have fun! In case of deployment
issues, please be sure to check the platform's CLI command:
heroku logs
We are constantly working on improvements on that matter - we have already created Nuxt.js installation module Laravel preset to add MDB to your SSR project quickly - you can find an instruction here
In some cases to get things done you need to install
bebel-preset-stage-2
through npm.
If this does not help, please contact us on support and describe your problem as accurately as possible.
Once you buy MDB product e.g. MDB 6 Pro, all updates for this product, along with Premium Support are free for a year. After this period your license is still valid and you can build projects with the most recent version of MDB in your account. Nevertheless, if you'd like to use Premium Support and the features from later updates you'd have to extend your license.
Couldn't find an answer to your question? Please visit the support forum or contact us.