반응형

 

✍️ 본문

👋 이런 코드 본 적 있으세요?

import { type User } from './types';

처음 보면 이런 생각 들죠.

"User는 타입인 거 뻔히 아는데... 굳이 type을 붙여야 하나요?"

저도 처음엔 안 붙여도 되는 줄 알았어요.
그런데 알고 보니, 붙이는 게 더 안전하고 좋은 습관이더라고요.


✅ 일단 User는 타입이에요

예를 들어 이런 타입이 있다고 해볼게요:

// types.ts
export type User = {
  name: string;
  age: number;
};

그럼 우리가 사용할 때는 보통 이렇게 쓰죠.

import { User } from './types';

const me: User = { name: '홍길동', age: 30 };

이거... 아무 문제 없어 보여요. 실제로도 잘 돌아가고요.


❗ 근데 왜 type을 붙일까요?

import { type User } from './types';

이렇게 쓰면 "나는 User를 타입으로만 쓸 거야!" 라고 명확하게 알려주는 거예요.

이게 왜 중요하냐면…


⚠️ 안 붙이면 생길 수 있는 문제

  1. 불필요한 코드가 앱에 들어가요
    → 타입인데도 실제 JS 코드에 포함돼서 번들(최종 파일)이 커져요.
  2. 런타임 에러가 날 수 있어요
    → 어떤 환경(특히 React Native)에서는 User가 실제 JS 값인 줄 알고 실행 중에 에러가 나기도 해요.

✅ 그래서 이렇게 구분하면 좋아요

상황 어떻게 import?

타입만 쓰는 경우 import { type User } from '...'
값(함수, 변수 등)도 쓰는 경우 그냥 import { something } from '...'

💡 결론

  • type을 꼭 붙여야 하는 건 아니에요
  • 하지만 붙이면 더 안전하고, 번들 크기도 줄고, 코드도 명확해져요!
  • 특히 React Native나 Vite 같은 환경에서는 실행 중 오류를 막는 데 도움이 돼요

📌 기억할 것 하나!

"타입만 쓸 거면 type 붙이자!"
그게 깔끔하고, 나중에 에러도 줄여줘요. 😊

반응형

+ Recent posts