A Vue collection of component with TailwindCSS
·
Report Bug
·
Request Feature
Lantern is a library of components written with Vue 3 and TailwindCSS. It provide 80+ components, from basics to complex layouts, all responsive for easily build your application.
- npm
npm install npm@latest -g
- Install NPM packages
npm install @pharos-lab/lantern
To use Lantern, just import the plugin from the package and tell vue to use it!
// main.js
import { createApp } from 'vue';
import { lantern } from '@pharos-lab/lantern'
// import tailwind styles
import '@pharos-lab/lantern/dist/styles.css'
import App from './App.vue';
const application = createApp(app);
application.use(lantern);
application.mount('#app');
Note: Since Lantern is written with tailwind, don't forget to import the
styles.css
css file !
Now You can use all the features of Lantern!
<script setup>
// your JavaScript code ...
</script>
<template>
// your code ...
<NameOfComponent>
// Slots if the component needed it
</NameOfComponent>
</template>
The Lantern plugin made the registration of all components so you don't have to import them and can start using them directly.
Contributions are what make the open source community such an amazing place to be learn, inspire, and create. Any contributions you make are greatly appreciated.
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/AmazingFeature
) - Commit your Changes (
git commit -m 'Add some AmazingFeature
) - Push to the Branch (
git push origin feature/AmazingFeature
) - Open a Pull Request
Distributed under the MIT License.
pharos-lab - @pharos-lab - [email protected]
Project Link: https://github.com/pharos-lab/lantern