mijin

mijin

Mijin is a UI component library built for Vue.js 2.x and Nuxt.js 2.x, leveraging Tailwind CSS for styling. It provides a set of responsive, customizable components designed to accelerate web development.

Key Features:

• Tailwind CSS Based: Utilizes Tailwind CSS utility classes for styling, ensuring consistency and ease of customization.
• Responsive Design: Components are designed to be responsive out-of-the-box, adapting to various screen sizes.
• Dark and Light Mode Support: Offers built-in support for both dark and light themes.
• Zero Dependencies: No external dependencies beyond Tailwind CSS and Vue.js, reducing project bloat.

Getting Started:

1. Install mijin and tailwindcss as dev dependencies:

   npm install mijin tailwindcss --save-dev
   # or
   yarn add mijin tailwindcss --dev

   Copy

2. Add the Mijin preset to your tailwind.config.js:

   const mijin = require('mijin/dist/tailwind-preset.js');
    
   module.exports = {
     presets: [
       mijin,
     ],
     purge: {
       content: [
         'node_modules/mijin/src/components/**/*.vue',
       ],
     },
   };

   Copy

3. Load the plugin in your Vue.js or Nuxt.js application.

Vue.js:

import Vue from 'vue'
import Mijin from 'mijin'
 
Vue.use(Mijin)

Nuxt.js:

Create a plugin file (plugins/mijin.js):

import Vue from 'vue';
import Mijin from 'mijin';
 
Vue.use(Mijin);

Then, add the plugin to your nuxt.config.js:

plugins: [
  '~/plugins/mijin.js',
]