@teamsparta/stack-codemod

TeamSparta 구 디자인 시스템 마이그레이션을 위한 도구입니다.

사용법

$3

#### 기본 사용법

``bash
npx @teamsparta/stack-codemod transform <버전> <마이그레이션-타입> --path <경로>
`

예시:

`bash


v1 버전의 텍스트 마이그레이션 실행

npx @teamsparta/stack-codemod transform v1 text --path "./src"

v1 버전의 폰트 스타일 마이그레이션 실행

npx @teamsparta/stack-codemod transform v1 font --path "./src"

v1 버전의 컬러 스타일 마이그레이션 실행

npx @teamsparta/stack-codemod transform v1 color --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` 옵션으로 먼저 테스트해보세요.
3. 마이그레이션 후 코드 리뷰를 통해 변경 사항을 확인하세요.
4. 완벽하지 않습니다. 수동으로 수정해야 할 수도 있습니다.
5. 커스텀 매핑을 사용할 경우 기존 매핑과의 충돌을 주의하세요.