https://github.com/bobbykim89/manguito-component-library

Manguito Component library is a component library based on Vue 3 and Tailwind CSS
https://github.com/bobbykim89/manguito-component-library

component-library lerna storybook tailwindcss vite vue3

Last synced: 19 days ago
JSON representation

Manguito Component library is a component library based on Vue 3 and Tailwind CSS

• Host: GitHub
• URL: https://github.com/bobbykim89/manguito-component-library
• Owner: bobbykim89
• License: mit
• Created: 2022-10-04T02:50:14.000Z (about 2 years ago)
• Default Branch: master
• Last Pushed: 2024-09-16T01:59:48.000Z (2 months ago)
• Last Synced: 2024-10-17T00:10:48.232Z (about 1 month ago)
• Topics: component-library, lerna, storybook, tailwindcss, vite, vue3
• Language: Vue
• Homepage: https://manguito-component-library.vercel.app
• Size: 3.1 MB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md
  • Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        


  

    

  



# Manguito Component Library (MCL)














> A simple component library based on Vue 3, SASS and Tailwind CSS

> MCL uses vite as bundler

## Project Setup

### Install packages

```sh

pnpm install

```

### Run dev server

```sh

pnpm run story:dev

```

### Create new component

```sh

pnpm run package:create

```

### Commit changes

```sh

git add . --or-- git add 

pnpm commit

git push

```

## Installation

```sh

pnpm i -D tailwindcss postcss autoprefixer sass

pnpm i @bobbykim/manguito-theme

npx tailwindcss init -p

```

tailwind.config.js

```js

const { mclTheme } = require('@bobbykim/mcl-theme')

module.exports = {

  content: [

    './src/**/*.{vue,ts,js,cjs}',

    './node_modules/@bobbykim/**/*.{vue,ts,js,cjs}',

  ],

  plugins: [mclTheme()],

}

```

## Usage

in your-file.vue

```vue

import {ComponentName} from '@bobbykim/<PackageName>'

...

  ...

  

  ...

```

## Dependencies

### Components

> Vue

> Vite

> SASS

> Typescript

> Tailwind CSS (tailwindcss, autoprefixer, postcss)

> @vitejs/plugin-vue

> vue-tsc

> @vueuse/core

### Story Page

> Storybook

> @storybook/vue3

### Package management

> Lerna

> pnpm workspace

## License

[MIT](http://opensource.org/licenses/MIT)