- tailwindcss.cssPath로 패키지 tailwind.css 중복 주입 방지 - tailwind content에 composables·modules·plugins 추가 - v0.0.63 문서 반영 Co-authored-by: Cursor <cursoragent@cursor.com>
56 lines
1.7 KiB
Markdown
56 lines
1.7 KiB
Markdown
# 코딩 컨벤션
|
|
|
|
## 언어
|
|
|
|
- JavaScript (TypeScript 미사용)
|
|
- JSDoc으로 타입 명시
|
|
- Zod로 스키마 검증
|
|
|
|
## 문법
|
|
|
|
- 세미콜론 미사용
|
|
- const/let 사용 (var 미사용)
|
|
- 화살표 함수 우선
|
|
|
|
## 네이밍
|
|
|
|
- Vue 컴포넌트: PascalCase (SiteHeader.vue)
|
|
- 일반 파일/폴더: kebab-case
|
|
- Vue 컴포넌트 파일: PascalCase
|
|
- CSS 클래스: kebab-case
|
|
- 고유 클래스명 필수 (Tailwind 외)
|
|
- Nuxt 컴포넌트 자동 import는 경로 prefix 없이 파일명 기준으로 사용
|
|
|
|
## 스타일
|
|
|
|
- TailwindCSS 기본 사용
|
|
- 다크 인증(`signin`/`signup`)의 텍스트 입력에는 `auth-form-input` 클래스를 붙여 `main.css`의 글자색·캐럿·placeholder를 적용한다(폼 컨트롤은 부모 `color`를 상속하지 않는 경우가 많음).
|
|
- Tailwind 엔트리는 `nuxt.config.js`의 `tailwindcss.cssPath: '~/assets/css/main.css'`로 통일한다(`@nuxtjs/tailwindcss` 기본 `assets/css/tailwind.css` 부재 시 패키지 `tailwind.css`가 중복 주입될 수 있음).
|
|
- 관리자 글 에디터는 블록 단위 UI로 작성하되 저장 값은 기존 마크다운 문자열을 유지
|
|
|
|
```html
|
|
<main class="site-main w-full max-w-full lg:max-w-[720px]">
|
|
```
|
|
|
|
## 주석
|
|
|
|
- JSDoc 형식
|
|
- 한국어 작성
|
|
|
|
```javascript
|
|
/**
|
|
* 게시물 목록 조회
|
|
* @param {Object} options - 조회 옵션
|
|
* @param {number} options.page - 페이지 번호
|
|
* @param {number} options.limit - 페이지당 개수
|
|
* @returns {Promise<Post[]>} 게시물 목록
|
|
*/
|
|
```
|
|
|
|
## 설정
|
|
|
|
- 경로/URL/키값: .env로 관리
|
|
- 하드코딩 금지
|
|
- 로컬 개발 설정과 NAS 운영 설정은 별도 환경 파일로 분리
|
|
- 운영 DB 접속 정보는 개발용 `.env`에 기록하지 않음
|