https://github.com/codepaintstudio/vuedir
VueDir is a lightweight library of custom directives for Vue.js.
https://github.com/codepaintstudio/vuedir
composition-api directives plugin typescript vue vue3
Last synced: 6 months ago
JSON representation
VueDir is a lightweight library of custom directives for Vue.js.
- Host: GitHub
- URL: https://github.com/codepaintstudio/vuedir
- Owner: codepaintstudio
- License: mit
- Created: 2025-02-13T08:12:27.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-06-16T08:10:25.000Z (8 months ago)
- Last Synced: 2025-06-20T17:09:30.713Z (8 months ago)
- Topics: composition-api, directives, plugin, typescript, vue, vue3
- Language: TypeScript
- Homepage: https://vuedir.feashow.cn/
- Size: 19 MB
- Stars: 18
- Watchers: 0
- Forks: 8
- Open Issues: 13
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Security: SECURITY.md
Awesome Lists containing this project
README
# đĄ VueDir
English | [įŽäŊä¸æ](./README.zh.md)
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):
```bash
pnpm add @cp-vuedir/core
```
> Note: Make sure you have [pnpm installed](https://pnpm.io/installation) before running this command.
## đ Usage
Register VueDir in your Vue application:
```ts
import { createApp } from 'vue'
import VueDir from '@cp-vuedir/core'
const app = createApp(App)
app.use(VueDir)
app.mount('#app')
```
Or import individual directives:
```ts
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](https://vuedir.feashow.cn/) for more information.
## đ¤ Contributing
We welcome all forms of contributions! Please check our [Contributing Guide](./CONTRIBUTING.md) to learn how to get involved.
### Development Setup
```bash
# 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:
```bash
# 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](https://github.com/CodePaintStudio/codepaint/blob/main/LICENSE) file for more details.