Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings
Open more actions menu

Repository files navigation

Draft UI

Documentation 简体中文

A shadcn/ui-inspired component library for Vue and React, built with pnpm monorepo.

🚀 Features

  • Monorepo: Powered by pnpm workspaces.
  • Copy-Paste Architecture: Components are imported directly into your project files (no node_modules bloating).
  • Multi-Framework: First-class support for both Vue 3 and React.
  • CLI Utility: Easy component management with draft-cli.
  • shadcn/ui Compatible: Reuses components.json for configuration.
  • Documentation: Built-in VitePress docs with interactive examples.

📁 Structure

.
├── apps
│   └── docs          # VitePress documentation
├── packages
│   ├── cli           # CLI tool (draft-cli)
│   ├── react         # React component templates
│   └── vue           # Vue component templates
└── test-app          # Test workspace

🛠️ Getting Started

Installation

pnpm install
pnpm build

Usage

To use the CLI in your project:

# Initialize project
npx draft-cli init

# Add a component (Vue)
npx draft-cli vue add [component]

# Add a component (React)
npx draft-cli react add [component]

Note: draft-cli is the unified entry point for managing components.

📄 Configuration

Draft UI uses a components.json file in your project root to manage paths:

{
  "style": "default",
  "aliases": {
    "components": "@/components",
    "ui": "@/components/ui"
  }
}

💻 Documentation

Online Documentation: https://preflower.github.io/draft-ui/

Run the documentation site locally:

pnpm dev

License

MIT

About

A shadcn/ui-inspired component library for Vue and React, built with pnpm monorepo.

Resources

Stars

Watchers

Forks

Releases

Packages

Contributors

Languages

Morty Proxy This is a proxified and sanitized view of the page, visit original site.