shadcn-vue-admin
Build and maintain the shadcn-vue-admin Vue 3 + Vite + TypeScript admin dashboard with shadcn-vue, Tailwind, Pinia, Vue Router, i18n, and TanStack Query. Use for UI/layout changes, page additions, routing updates, theme/auth work, and component integration in this repo.
Installation
Pick a client and clone the repository into its skills directory.
Installation
About this skill
Build and maintain the shadcn-vue-admin Vue 3 + Vite + TypeScript admin dashboard with shadcn-vue, Tailwind, Pinia, Vue Router, i18n, and TanStack Query. Use for UI/layout changes, page additions, routing updates, theme/auth work, and component integration in this repo.
How to use
Zainstaluj umiejętność w swoim środowisku agenta, wskazując repozytorium Whbbit1999/shadcn-vue-admin jako źródło. Upewnij się, że masz zainstalowany pnpm jako menedżer pakietów.
Przed rozpoczęciem pracy zapoznaj się ze strukturą projektu: routing znajduje się w
src/router/, strony i layouty wsrc/pages/isrc/layouts/, komponenty wsrc/components/, stan aplikacji wsrc/stores/, a narzędzia pomocnicze wsrc/utils/isrc/lib/.Gdy chcesz dodać nową stronę, zmienić layout lub zmodyfikować routing, przeanalizuj istniejące implementacje w docelowym katalogu i ponownie użyj ustalonych wzorców i stylów. Preferuj komponenty shadcn-vue i wspólne narzędzia, aby uniknąć duplikacji kodu.
Po każdej zmianie kodu uruchom
pnpm lint:fixaby naprawić problemy ze stylem kodu. Jeśli modyfikujesz logikę wsrc/lib/,src/utils/,src/composables/,src/services/,src/router/lubsrc/stores/, uruchompnpm buildaby sprawdzić, czy projekt się buduje poprawnie.Jeśli w projekcie istnieją skrypty testów (np.
pnpm testlubpnpm test:unit), dodaj lub zaktualizuj testy dla zmian w logice i uruchom je. Testy są opcjonalne, ale zalecane dla zmian w kodzie krytycznym.Aby przetestować zmiany lokalnie, uruchom
pnpm devaby uruchomić serwer deweloperski, a następnie przejrzyj interfejs w przeglądarce.