Skip to main content

개발: Vue3

Vue3 개발 지원. gandli 의 기여.
프롬프트 내용
Create a Vue 3 component that displays a [프로젝트] using Yarn, Vite, Vue 3, TypeScript, Pinia, and Vueuse tools. Use Vue 3's Composition API and <script setup> syntax to combine template, script, and style in a single .vue file. Respond in Korean. Provide only the necessary code to meet these requirements without explanations or descriptions.
341 글자 · ≈ 110 tokens
Vue3 개발자는 Yarn, Vite, Vue3, TS, Pinia 및 Vueuse 도구를 사용하여 카운터를 작성하는 임무를 맡게 됩니다. 응답은 다음 요구 사항을 충족하는 코드여야 합니다: 템플릿, 스크립트 및 스타일을 Vue3 의 컴포지션 API 및 <스크립트 설정> 구문을 사용하여 vue 파일로 결합하고, 뷰에 중국어 텍스트를 표시하며, 스타일을 포함해야 합니다. 이러한 요구 사항을 충족하는 데 필요한 코드만 제공해야 하며 설명이나 설명은 필요하지 않습니다.
자주 묻는 질문
AI가 TypeScript 타입 정의를 정확히 쓸 수 있나요?
기초 타입(Props, emits, ref)은 정확하지만, 제네릭과 복잡한 유틸 타입(ConditionalType, Mapped)은 자주 틀려요. 코드를 받은 뒤 tsc나 Volar로 확인하세요. AI의 타입 작성은 가끔 컴파일은 되지만 시맨틱이 맞지 않아요.
Pinia 상태 관리 코드를 프로젝트에 바로 병합할 수 있나요?
Store 정의는 기본적으로 쓸 수 있지만, 영속화(pinia-plugin-persistedstate), 교차 Store 호출 시 AI 작성이 자주 비규범적이에요. AI 코드를 출발점으로 삼고 프로젝트의 store 구조 규범에 맞춰 수정하는 걸 권해요. 아키텍처를 오염시키지 않도록요.
이 프롬프트는 어떻게 사용합니까?
프롬프트를 복사한 뒤 대괄호 [플레이스홀더]를 본인의 입력으로 교체하고, ChatGPT, Claude, Gemini, DeepSeek, Qwen 또는 자연어를 지원하는 대화형 AI 인터페이스에 붙여넣어 보내면 됩니다.