@basiln/codemod

@basiln/design-system, @basiln/design-system-native 마이그레이션을 위한 codemod CLI 도구입니다.

사용 가능한 Codemods

| 이름 | 설명 | |------|------| | text-props | Text 컴포넌트의 deprecated size prop을 새 토큰(size + weight)으로 변환 |

CLI 사용법

기본 실행

npx @basiln/codemod <codemod-name> <path> [options]

옵션

| 옵션 | 설명 | |------|------| | --dry | 파일을 실제로 수정하지 않고 변경 사항만 확인 | | --print | 변환된 코드를 터미널에 출력 | | --verbose=0\|1\|2 | 상세 출력 레벨 (기본값: 0) | | --list | 사용 가능한 codemod 목록 출력 | | --help, -h | 도움말 출력 |

예시

# src 디렉토리 전체 변환
npx @basiln/codemod text-props ./src

# 특정 디렉토리만 변환
npx @basiln/codemod text-props ./src/components

# 실제 수정 없이 미리보기
npx @basiln/codemod text-props ./src --dry --print

# 사용 가능한 codemod 목록 확인
npx @basiln/codemod --list

text-props

@basiln/design-system 또는 @basiln/design-system-native에서 import한 Text 컴포넌트의 deprecated size prop을 새 타이포그래피 토큰으로 변환합니다.

변환 예시

// Before
<Text size="btn-medium">텍스트</Text>
<Text size="title-large">타이틀</Text>

// After
<Text size="caption1" weight="bold">텍스트</Text>
<Text size="title3" weight="bold">타이틀</Text>

변환 규칙

weight가 이미 있는 경우 weight는 추가하지 않고 size만 변환합니다.

// Before
<Text size="btn-medium" weight="bold">텍스트</Text>

// After
<Text size="caption1" weight="bold">텍스트</Text>

아래 토큰은 아직 매핑이 확정되지 않아 변환하지 않습니다.

| 보류 토큰 | |-----------| | head-medium | | caption-small | | caption-tiny | | btn-small | | btn-tiny |

개발 및 테스트

테스트 실행

yarn workspace @basiln/codemod test
# 또는 패키지 디렉토리에서
npm test

테스트 워치 모드

yarn workspace @basiln/codemod test:watch

Output Fixture 재생성

transform 로직이 변경되면 아래 명령으로 예상 output fixture 파일을 갱신합니다.

# 패키지 디렉토리에서 실행
npm run test:preview text-props

src/__tests__/fixtures/text-props.output.tsx 파일이 갱신되며, 이 파일이 테스트의 기준값으로 사용됩니다.

새 Codemod 추가

1. src/transforms/<name>.ts — transform 로직 작성
2. src/__tests__/fixtures/<name>.input.tsx — 변환 전 입력 fixture 작성
3. yarn test:preview <name> — output fixture 자동 생성
4. src/__tests__/<name>.test.ts — fixture 비교 테스트 작성
5. src/cli.ts의 CODEMODS 객체에 항목 추가