Quickstart
Learn how to get started with the free and open-source Flowbite Mithril UI component library based on the utility classes from Tailwind CSS
Getting started #
You can install Flowbite Mithril to any Node.js project.
You’ll need to be familiar with Node.js, and have it installed.
Setup Tailwind CSS #
Install Tailwind CSS:
npm i autoprefixer postcss tailwindcss
npx tailwindcss init -p
Point Tailwind CSS to files you have class="..."
in:
module.exports = {
content: ["./src/**/*.js"],
theme: {
extend: {},
},
plugins: [],
};
Add Tailwind CSS to a CSS file:
@tailwind base;
@tailwind components;
@tailwind utilities;
Install Flowbite Mithril #
Install Flowbite and Flowbite Mithril:
npm i -D flowbite flowbite-mithril
Add the Flowbite plugin to tailwind.config.js
, and include content from flowbite-mithril
:
module.exports = {
content: ["./node_modules/flowbite-mithril/**/*.js"],
plugins: [require("flowbite/plugin")],
};
Try it out #
How you use Flowbite Mithril depends on your project setup. In general, you can just import the components you want to use from flowbite-mithril
and use them in a Mithril .js
file:
import { Button } from "flowbite-mithril";
const Component = {
view: () =>
m(Button, "Click me"),
};