[TYPESCRIPT] 개발 환경 세팅: Node.js, npm, pnpm, ts-node 설치하기 - TypeScript 프로젝트를 위한 필수 준비

TypeScript 기반의 백엔드나 프론트엔드 프로젝트를 시작하려면, 먼저 올바른 Node.js 개발 환경을 세팅하는 것이 중요합니다. 

Node.js, npm, pnpm, ts-node를 설치하고 기본 설정을 완료하는 과정을 알려드리겠습니다.

 

Node.js 설치

Node.js는 JavaScript를 브라우저 외부에서도 실행할 수 있게 해주는 런타임 환경입니다. TypeScript 실행, 패키지 설치, 빌드 등 대부분의 개발 도구가 Node.js 위에서 작동합니다.

1. 설치 방법

Node.js는 공식 홈페이지에서 다운로드할 수 있습니다.

• LTS(Long Term Support) 버전 권장 (안정적)
• Current 버전은 최신 기능 테스트용

# macOS (Homebrew)
brew install node

# Ubuntu / Debian
sudo apt update
sudo apt install -y nodejs npm

설치 확인:

node -v
v20.12.2

npm -v
10.5.0

버전이 출력되면 정상적으로 설치된 것입니다.

 

npm (Node Package Manager)

npm은 Node.js의 기본 패키지 관리자입니다. 외부 라이브러리 설치, 스크립트 실행, 빌드 관리 등 프로젝트의 중심 역할을 합니다.

1. 프로젝트 초기화

TypeScript 프로젝트를 시작할 때는 먼저 package.json을 생성해야 합니다.

mkdir my-ts-app
cd my-ts-app
npm init -y

명령 실행 후, 기본적인 프로젝트 설정 파일이 생성됩니다.

 

2. 주요 npm 명령어

npm install package-name         # 패키지 설치
npm install -D package-name      # 개발용(Dev) 패키지 설치
npm uninstall package-name       # 패키지 제거
npm update                       # 전체 패키지 업데이트
npm run script-name              # package.json 내 스크립트 실행

기본적으로 npm은 node_modules 디렉터리에 의존성을 관리합니다.

 

pnpm 설치 (고속 패키지 관리자)

pnpm은 npm, yarn보다 빠르고 효율적인 패키지 관리자입니다. 하드 링크(Hard Link) 방식을 사용하여 디스크 공간을 절약하고 설치 속도를 향상시킵니다.

1. pnpm 설치

npm install -g pnpm

설치 확인:

pnpm -v
9.0.0

2. 프로젝트 초기화

기존 npm 프로젝트를 pnpm으로 전환할 수도 있습니다.

pnpm init
pnpm install

pnpm은 내부적으로 ~/.pnpm-store를 사용하여 중복된 패키지를 캐싱하므로 대형 프로젝트에 특히 유용합니다.

 

TypeScript 및 ts-node 설치

TypeScript는 JavaScript에 정적 타입을 추가한 언어이며, ts-node는 TypeScript 파일을 별도의 컴파일 과정 없이 즉시 실행할 수 있게 해줍니다.

1. TypeScript 설치

pnpm install -D typescript

설치 후 컴파일러 버전 확인:

npx tsc -v
Version 5.3.3

 

2. ts-node 설치

ts-node는 TypeScript 파일을 바로 실행할 수 있는 런타임입니다. 개발 중 빠른 테스트에 매우 유용합니다.

pnpm install -D ts-node @types/node

설치 후 실행:

npx ts-node index.ts

별도의 컴파일 없이 TypeScript 파일을 바로 실행할 수 있습니다.

 

tsconfig.json 설정

TypeScript 설정 파일은 프로젝트의 빌드 동작을 제어합니다. 아래 명령으로 기본 설정 파일을 생성할 수 있습니다.

npx tsc --init

대표적인 설정 예시:

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "commonjs",
    "rootDir": "./src",
    "outDir": "./dist",
    "strict": true,
    "esModuleInterop": true
  }
}

이 설정은 TypeScript를 ECMAScript 2020으로 변환하며, src 디렉터리의 코드를 dist 폴더로 컴파일하도록 지정합니다.

 

첫 TypeScript 실행 테스트

아래와 같은 간단한 코드를 작성해 TypeScript 환경이 정상적으로 작동하는지 확인합니다.

// index.ts
const greeting: string = "Hello, TypeScript!";
console.log(greeting);

실행:

npx ts-node index.ts
# 출력
Hello, TypeScript!

이 메시지가 출력되면 환경 세팅이 성공적으로 완료된 것입니다.

 

개발 환경 요약

도구	역할
Node.js	JavaScript/TypeScript 실행 환경
npm	기본 패키지 관리자
pnpm	고속·저용량 패키지 관리자
TypeScript	정적 타입 기반 언어
ts-node	TypeScript 파일 즉시 실행 도구

 

주의할 점

• Node.js 버전은 LTS(Long Term Support) 버전 사용 권장
• 글로벌 설치(-g)와 로컬 설치를 구분하여 관리
• 프로젝트별 Node 버전 관리에는 nvm(Node Version Manager) 사용 추천
• Windows 사용자는 PowerShell 대신 WSL(Windows Subsystem for Linux) 사용 시 호환성 우수

 

---

 

이제 Node.js와 TypeScript 실행 환경이 준비되었습니다.