#45 devDependencies에 TypeScript와 @types 추가하기

2023. 4. 6.·🎨 프론트엔드 공부/JS & TS

이펙티브 타입스크립트 (댄 밴더캄 지음) 를 읽고 정리

📍요약

✅타입스크립트를 시스템 레벨로 설치하면 안된다 (npm 전역 설치 금지)

- devDependencies 에 포함하여 팀원 모두가 동일한 버전을 사용하도록 해야 한다

 

✅@types 의존성도 devDependencies 에 포함해야 한다

 

📍npm은 의존성을 3가지로 구분한다

1. dependencies- 런타임에 필요한 라이브러리들- 프로젝트가 npm에 공개되면, dependencies의 라이브러리들도 함께 설치됨(전이 의존성, transitive dependencies 이라고 함)

 

2. devDependencies- 현재 프로젝트를 개발하고 테스트하는데 필요하지만, 런타임에는 필요없는 라이브러리들- 주로 테스트 프레임워크들..- 프로젝트가 npm에 공개되면 devDependencies의 라이브러리들은 필요 없음

 

3. peerDependencies

- 런타임에 필요하지만, 의존성을 직접 관리하지 않는 라이브러리들- 주로 플러그인들..

 

📍TypeScript 프로젝트에서 고려할 의존성 2가지

✅TypeScript는 개발 도구일 뿐, 타입 정보는 런타임에 존재하지 않으므로 일반적으로 devDependencies 에 설치

 

1. TypeScript 자체 의존성

⭐시스템 레벨에서 설치 금지 (npm 전역 설치 금지)

 

이유

- 팀원들 모두가 동일한 typescript 버전을 사용하기 힘듬

- 어차피 프로젝트를 셋업할 때 별도로 설치가 필요

 

전역설치 하지 않아도, npx tsc 명령어로 컴파일 가능 (tsc 명령어로 실행하려면 ts-node 설치도 필요)

 

2. 타입 의존성 (@types)

- 마찬가지로 런타임에서 타입은 없어지므로, devDependencies에 설치

- 구현체는 포함 X

'🎨 프론트엔드 공부/JS & TS' 카테고리의 다른 글
  • #46 타입 선언과 관련된 세 가지 버전 이해하기
  • [Web API] 서비스 워커 (service worker)
  • #43 몽키 패치보다는 안전한 타입을 사용하기
  • JavaScript 실행시간 측정 : performance.now()
지식물원
지식물원
지식이 자라는 식물원!
  • 지식물원
    지식물원
    지식물원
  • 전체
    오늘
    어제
    • 분류 전체보기 (516)
      • 🎨 프론트엔드 공부 (253)
        • JS & TS (92)
        • HTML & CSS (22)
        • React & Next (49)
        • Vue & Nuxt (22)
        • 기타 (68)
      • 🤓 기술 학습 & 공부 기록 (116)
        • Node.js (0)
        • Python (37)
        • 백엔드 (0)
        • 딥러닝 (1)
        • 컴퓨터 일반 (72)
        • 개발 인프라 (6)
      • 👨‍💻 프로젝트 경험 (6)
        • Work (0)
        • Toy (6)
      • ⚙️ 개발 팁 & 노하우 (21)
        • 프론트엔드 (6)
        • 기타 (15)
      • ☕️ 커리어 & 인터뷰 준비 (88)
        • 코딩 테스트 (88)
      • 📰 기술 트렌드 & 생각 정리 (4)
      • 📚 기타 (25)
        • 마케팅 (15)
        • 비개발서적 (10)
  • 블로그 메뉴

    • 태그
  • 링크

  • 공지사항

    • 모바일 접속 시 코드 하이라이팅 깨질 때
  • 인기 글

  • hELLO· Designed By정상우.v4.10.3
지식물원
#45 devDependencies에 TypeScript와 @types 추가하기
상단으로

티스토리툴바