Package Exports

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (mdb.test) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

MDB 5 Vite Starter

Vite boilerplate for Bootstrap 5 & Material Design 2.0 UI Kit

>> Support MDB 5 with a STAR

>> MDB 5 Demo

⚠️ The use of this Starter is at your own risk and assumes basic knowledge of Vite, JavaScript and CSS preprocessors. We recommend creating custom versions of MDB UI KIT and themes only for advanced developers.

Installation

npm install

A free version of MDB UI Kit is already included as a dependency, to upgrade it to PRO version install the package you own with the command below.

Pro Essential installation

npm install git+https://oauth2:ACCESS_TOKEN@git.mdbootstrap.com/mdb/standard/mdb-ui-kit-pro-essential

Pro Advanced installation

npm install git+https://oauth2:ACCESS_TOKEN@git.mdbootstrap.com/mdb/standard/mdb-ui-kit-pro-advanced

Dev Server

npm run start

Build

npm run build

Features:

Bundling via Vite v3.1.0
ES6+ Support via babel-cli v7.18.10
SASS Support via sass v1.54.8
Linting via eslint-webpack-plugin v3.2.0
Unit Testing via jest v29.0.1
Code Formatting via prettier v2.7.1

Files structure:

my-project/
├── src/
│   ├── js/
│   ├── scss/
│   └── index.html
└── vite.config.js

MDB UI KIT - Importing of MDB files

Importing JS modules

You can import the entire library or just individual modules:

import * as mdb from 'mdb-ui-kit'; // lib
import { Input } from 'mdb-ui-kit'; // module
import { Input as CustomInput } from 'mdb-ui-kit'; // module with custom name

Importing CSS file

To import MDB stylesheet please use the following syntax:

@import 'mdb-ui-kit/css/mdb.min.css';