📡 VueDir

English | 简体中文

VueDir is a lightweight collection of Vue 3 directives designed to provide a set of practical custom directives that help developers build Vue applications more efficiently.

✨ Features

• 🎯 Focus Directive: Provides v-focus directive for automatic focus functionality
• 🎨 Lightweight: Import on demand, no extra bundle size
• 🔧 Easy to Use: Simple API design for quick adoption
• 📦 TypeScript: Written in TypeScript with complete type support

📦 Installation

Install with pnpm (recommended):

pnpm add @cp-vuedir/core

Note: Make sure you have pnpm installed before running this command.

🚀 Usage

Register VueDir in your Vue application:

import { createApp } from 'vue'
import VueDir from '@cp-vuedir/core'

const app = createApp(App)
app.use(VueDir)
app.mount('#app')

Or import individual directives:

import { createApp } from 'vue'
import { vFocus, vDrag } from '@cp-vuedir/core'

const app = createApp(App)
app.directive('focus', vFocus)
app.directive('drag', vDrag)
app.mount('#app')

📖 Documentation

Visit our official documentation for more information.

🤝 Contributing

We welcome all forms of contributions! Please check our Contributing Guide to learn how to get involved.

Development Setup

# Make sure you have pnpm installed (https://pnpm.io/installation)
npm install -g pnpm

# Clone the repo
git clone https://github.com/CodePaintStudio/vuedir
cd vuedir

# Install dependencies
pnpm install

# Start development environment
pnpm dev

Code Formatting

This project uses Prettier for code formatting. You can format your code by running:

# Format all files
pnpm format

# Check if files are correctly formatted
pnpm format:check

The Prettier configuration is defined in .prettierrc at the project root.

📄 License

VueDir is open-source software licensed under the MIT License. See the MIT License file for more details.