CodeMod CLI for TeamSparta Design System migration
TeamSparta 구 디자인 시스템 마이그레이션을 위한 도구입니다.
#### 기본 사용법
``bash`
npx @teamsparta/stack-codemod transform <버전> <마이그레이션-타입> --path <경로>
예시:
`bashv1 버전의 텍스트 마이그레이션 실행
npx @teamsparta/stack-codemod transform v1 text --path "./src"
$3
특정 버전에서 사용할 수 있는 마이그레이션 타입을 확인할 수 있습니다:
`bash
npx @teamsparta/stack-codemod list v1
`$3
`bash
기본 사용법
npx @teamsparta/stack-codemod transform v1 font --path "./src"Dry run (파일 변경 없이 실행)
npx @teamsparta/stack-codemod transform v1 color --dry특정 파서 지정 (기본값: tsx)
npx @teamsparta/stack-codemod transform v1 font --parser=babel특정 확장자 지정
npx @teamsparta/stack-codemod transform v1 color --extensions js,jsx,ts,tsx상세 로그 출력
npx @teamsparta/stack-codemod transform v1 font --verbose특정 파일/폴더 무시
npx @teamsparta/stack-codemod transform v1 text --ignore "/test/" "/node_modules/"커스텀 매핑 사용
npx @teamsparta/stack-codemod transform v1 color --mapping "./custom-mapping.json"
`$3
몇몇 codemod의 경우 기본 매핑 대신 사용자 정의 매핑을 사용할 수 있습니다:
`bash
사용자 정의 매핑 확인
npx @teamsparta/stack-codemod list v1
응답
ℹ v1 버전에서 사용 가능한 마이그레이션 타입:
- font 커스텀 매핑 지원 <- 지원인 경우 커스텀 매핑 사용 가능
- color 커스텀 매핑 지원
- text 커스텀 매핑 지원
커스텀 매핑 사용 방법:
# npx @teamsparta/stack-codemod transform <버전> <마이그레이션-타입> -m <매핑-파일-경로>
``bash
JSON 파일에서 매핑 로드
npx @teamsparta/stack-codemod transform v1 color -m "./custom-mapping.json"
`#### 매핑 파일 예시
매핑 파일은 JSON 형식이어야 합니다:
`json
{
"wHeader1": "customHeroTitle",
"wBody1": "customBodyB",
"mBody2": "customBodyM"
}
`마이그레이션 내용
$3
#### 폰트 마이그레이션
- 기존 폰트 스타일을 새로운 디자인 시스템 폰트로 마이그레이션
- import 구문 자동 업데이트
- 예:
@teamsparta/design-system → @teamsparta/stack-font#### 텍스트 마이그레이션
- 기존 텍스트 컴포넌트를 새로운 디자인 시스템 컴포넌트로 마이그레이션
- import 구문 자동 업데이트
- 예:
@teamsparta/design-system → @teamsparta/stack-text#### 컬러 마이그레이션
- 기존 컬러 토큰을 새로운 디자인 시스템 컬러로 마이그레이션
- import 구문 자동 업데이트
- 예:
@teamsparta/design-system → @teamsparta/stack-tokens지원하는 파일 형식
- TypeScript (.ts, .tsx)
- JavaScript (.js, .jsx)
주의사항
1. 마이그레이션 전 반드시 코드를 커밋하세요.
2. 큰 프로젝트의 경우
--dry --verbose` 옵션으로 먼저 테스트해보세요.