@toss/tds-migration

@toss-design-system/* 패키지를 @toss/tds-*로 마이그레이션하기 위한 CLI 도구입니다.

설치

pnpm add -D @toss/tds-migration

사용법

Import Path 마이그레이션

TypeScript/TSX 파일의 import path를 변환합니다.

# 기본 사용법
npx tds-migrate imports

# 특정 경로 지정
npx tds-migrate imports --path "src/**/*.{ts,tsx}"

# tsconfig 경로 지정
npx tds-migrate imports --tsconfig tsconfig.json

# dry-run (변경 미리보기)
npx tds-migrate imports --dry-run

변환 예시

// Before
import { colors } from '@toss-design-system/colors';
import { flex, spacing } from '@toss-design-system/css-utils';
import { TDSMobile } from '@toss-design-system/mobile';

// After
import { colors } from '@toss/tds-colors';
import { flex, spacing } from '@toss/tds-css-utils';
import { TDSMobile } from '@toss/tds-mobile';

Package.json Dependencies 마이그레이션

package.json의 dependencies를 변환하고 버전을 업데이트합니다.

# 기본 사용법
npx tds-migrate deps

# 특정 경로 지정
npx tds-migrate deps --path "packages/**/package.json"

# dry-run (변경 미리보기)
npx tds-migrate deps --dry-run

변환 예시

// Before
{
  "dependencies": {
    "@toss-design-system/colors": "0.1.0",
    "@toss-design-system/mobile": "2.1.0"
  }
}

// After
{
  "dependencies": {
    "@toss/tds-colors": "^0",
    "@toss/tds-mobile": "^2"
  }
}

전체 마이그레이션

import path와 package.json dependencies를 모두 마이그레이션합니다.

# 기본 사용법
npx tds-migrate all

# 특정 경로 지정
npx tds-migrate all --path "./src"

# dry-run
npx tds-migrate all --dry-run

옵션

| 옵션 | 설명 | 기본값 | |------|------|--------| | -p, --path <path> | 마이그레이션 대상 경로 (glob 패턴) | **/*.{ts,tsx} / **/package.json | | --tsconfig <path> | tsconfig.json 경로 | tsconfig.json | | --dry-run | 변경 없이 미리보기만 | false |

마이그레이션 매핑

| From | To | Version | |------|-----|---------| | @toss-design-system/colors | @toss/tds-colors | ^0 | | @toss-design-system/css-utils | @toss/tds-css-utils | ^0 | | @toss-design-system/typography | @toss/tds-typography | ^0 | | @toss-design-system/color-utils | @toss/tds-color-utils | ^0 | | @toss-design-system/spring-easing | @toss/tds-spring-easing | ^0 | | @toss-design-system/easings | @toss/tds-easings | ^0 | | @toss-design-system/react-native | @toss/tds-react-native | ^1 | | @toss-design-system/mobile | @toss/tds-mobile | ^2 | | @toss-design-system/mobile-bedrock | @toss/tds-mobile-ait | ^1 | | @toss-design-system/mobile-migration | @toss/tds-mobile-migration | ^2 |

Programmatic API

CLI 외에 프로그래밍 방식으로도 사용할 수 있습니다.

import {
  migrateImportDeclarations,
  migratePackageJsonFile,
  MIGRATION_MAP
} from '@toss/tds-migration';
import { Project } from 'ts-morph';

// Import 마이그레이션
const project = new Project();
const sourceFile = project.addSourceFileAtPath('src/index.ts');
const changes = migrateImportDeclarations(sourceFile);
sourceFile.saveSync();

// Package.json 마이그레이션
const result = migratePackageJsonFile('package.json');
console.log(result.changedPackages);