！注意このプロジェクトは初期段階であり、進化します。頻繁な更新と潜在的な変更を想定してください。フィードバックは歓迎です！

機能

• 簡単なセットアップ: シンプルなセットアッププロセスと最小限のメンテナンスで、コンポーネントの構築に集中できます。
• ストーリー不要: コンポーネントコードを直接分析し、ストーリーを作成する必要がありません。
• 高速: Vite上に構築されており、迅速な開発と即時のフィードバックを提供し、生産性を向上させます。
• DevTools統合: VueおよびNuxtのDevToolsと統合し、一貫した開発体験を提供します。
• UIライブラリ統合: 人気のUIライブラリと統合し、ローカルにインストールされたコンポーネントの例を表示します。
• コード生成: コンポーネントのプロパティに基づいて最新のテンプレートコードを生成し、すぐにコピーして使用できます。

インストール

Nuxt

npx nuxi@latest module add --dev compodium

Vue

1. @compodium/vueをインストール

pnpm add -D @compodium/vue

yarn add --dev @compodium/vue

npm install --save-dev @compodium/vue

bun add -D @compodium/vue

2. vite.config.tsにCompodiumプラグインを追加

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import vueDevTools from 'vite-plugin-vue-devtools'
import { compodium } from '@compodium/vue'

export default defineConfig({
  plugins: [
    vue(),
    vueDevTools(),
    compodium()
  ]
})

3. tsconfig.app.jsonにCompodiumの型を含める

{
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "node_modules/@compodium/vue/dist/index.d.ts"
  ],
}

貢献

貢献を歓迎します！♥️

現在、お気に入りのコンポーネントライブラリの例を追加することで貢献できます。Nuxt UIのコレクションと例はこちらで見つけることができます。

ローカル開発

# Install dependencies
pnpm install

# Generate type stubs
pnpm dev:prepare

# Develop with the playground
pnpm dev

# Run ESLint
pnpm lint

# Run typechecks 
pnpm typechecks 

# Run Vitest
pnpm test