菜单
Desenvolve formulários com VeeValidate e Zod seguindo padrões do projeto. Use quando criando formulários, schemas de validação ou integrando validação com i18n.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Princípios do Tailwind CSS v4. Configuração CSS-first, container queries, padrões modernos, arquitetura de design tokens.
Integração e uso dos componentes UI do projeto Vue 3. Os componentes vêm do shadcn-vue (estilizados) e Reka UI (primitivos). Use quando criando componentes UI, formulários, ou precisando de componentes de interface.
Desenvolve aplicações Vue 3 seguindo arquitetura Feature-Sliced Design (FSD), implementando lazy loading, code splitting, e padrões de performance. Use quando desenvolvendo features, componentes, ou trabalhando com Vue 3 neste projeto.
Desenvolve testes unitários com Vitest e testes E2E com Playwright seguindo padrões do projeto. Use quando criando ou modificando testes, ou quando precisar de templates e padrões de teste.
| name | vue3-forms-validation |
| description | Desenvolve formulários com VeeValidate e Zod seguindo padrões do projeto. Use quando criando formulários, schemas de validação ou integrando validação com i18n. |
Guidelines completas para desenvolvimento de formulários com VeeValidate + Zod + zod-i18n-map no projeto Vue 3 FSD.
toTypedSchema para integração VeeValidate + Zod@/shared/components/ (shadcn-vue) para formulários@/shared/components/O projeto já tem i18n configurado em app/plugins/i18n-zod.ts:
import i18next from 'i18next'
import { z } from 'zod'
import { zodI18nMap } from 'zod-i18n-map'
import translation from 'zod-i18n-map/locales/pt/zod.json'
export function setupI18nZod() {
i18next.init({
lng: 'pt',
resources: {
pt: {
zod: translation,
},
},
})
z.setErrorMap(zodI18nMap)
}
Não precisa configurar manualmente - já está no main.ts.
features/[feature]/model/[feature]Schema.tsz.infer<typeof schema> para tipos derivadosvalidateOnMount: false por padrãovalidate()FormMessage e toast para erros de submit