0Pricing
TypeScript Academy · 강의

모노레포와 프로젝트 참조

워크스페이스 모노레포를 만들고 TypeScript 프로젝트 참조를 연결해 빠른 증분 빌드와 깔끔한 패키지 간 타입을 구현합니다.

모노레포와 프로젝트 참조은(는) CoddyKit의 무료 TypeScript Academy 강의입니다. 이것은 1개 중 1번째 강의입니다. 아래에서 전체 강의를 무료로 읽을 수 있으며, 내장 코드 에디터와 24/7 AI 튜터와 함께 브라우저에서 직접 실습할 수 있습니다. 이 강의는 TypeScript Academy 학습 경로의 일부이며, 진행 상황이 웹과 CoddyKit 앱에 동기화됩니다. TypeScript Academy 강의에는 총 1개의 강의가 포함되어 있습니다.

소개

목표: 확장 가능한 모노레포를 구성합니다. 워크스페이스를 선언하고, 프로젝트 참조를 추가하며, 증분 출력을 위해 tsc -b로 빌드합니다.

  • pnpm/yarn 워크스페이스
  • 합성 프로젝트
  • 공유 타입

작업 공간 구성

간단한 두 패키지 구성입니다: 공유(라이브러리)와 앱(공유에 의존)입니다. 워크스페이스는 로컬 패키지를 연결합니다.

# folder structure (for reference)
			/monorepo
			package.json
			tsconfig.base.json
			packages/
			shared/
			src/index.ts
			package.json
			tsconfig.json
			app/
			src/index.ts
			package.json
			tsconfig.json

루트 워크스페이스

패키지 관리자가 로컬 종속성을 연결하도록 워크스페이스를 선언합니다. TS 빌드 모드를 사용하여 build/clean 스크립트를 추가합니다.

// package.json (root)
			{
			"name": "monorepo",
			"private": true,
			"workspaces": ["packages/*"],
			"scripts": {
			"build": "tsc -b packages/*",
			"clean": "tsc -b packages/* --clean"
			}
			}

공유 패키지

라이브러리를 복합 프로젝트로 지정합니다. 의존하는 패키지가 빠르게 타입 검사를 수행할 수 있도록 선언 파일을 생성합니다.

// packages/shared/tsconfig.json
{
  "extends": "../../tsconfig.base.json",
  "compilerOptions": {
    "outDir": "dist",
    "rootDir": "src",
    "declaration": true,
    "composite": true
  },
  "include": ["src"]
}

// packages/shared/src/index.ts
export interface User { id: string; name: string }
export const hello = (u: User) => `Hello, ${u.name}`

앱 패키지 및 참조

shared에 의존하도록 참조 항목을 추가합니다. 빌더는 먼저 shared를 컴파일한 다음 app을 컴파일합니다.

// packages/app/tsconfig.json
			{
			"extends": "../../tsconfig.base.json",
			"compilerOptions": {
			"outDir": "dist",
			"rootDir": "src",
			"composite": true
			},
			"references": [
			{ "path": "../shared" }
			],
			"include": ["src"]
			}

			// packages/app/src/index.ts
		import { hello } from "shared"
console.log(hello({ id: "u1", name: "Ada" }))

기본 설정 및 팁

팁:

  • 공유 컴파일러 옵션을 위해 tsconfig.base.json을 만듭니다.
  • 패키지 이름을 그대로 반영하는 paths 매핑을 사용합니다.
  • 증분 로컬 개발을 위해 tsc -b --watch를 실행합니다.

참조 요구 사항 확인

빠른 확인: 참조되는 각 패키지에 무엇을 포함해야 하나요?

요약

요약: 워크스페이스는 로컬 패키지를 연결하고, 프로젝트 참조(복합 프로젝트 + 참조)는 빠른 증분 tsc -b 빌드와 안정적인 패키지 간 타입을 가능하게 합니다.

자주 묻는 질문

“모노레포와 프로젝트 참조” 강의는 무료인가요?

네 — “모노레포와 프로젝트 참조” 전체 내용을 이 웹사이트에서 무료로 읽을 수 있습니다. 인터랙티브하게 실습하려면(내장 코드 에디터와 24/7 AI 튜터), CoddyKit PRO로 업그레이드하면 TypeScript Academy 강의 전체를 잠금 해제할 수 있습니다. TypeScript Academy 강의에는 총 1개의 강의가 포함되어 있습니다.

“모노레포와 프로젝트 참조”에서 뭘 배우나요?

워크스페이스 모노레포를 만들고 TypeScript 프로젝트 참조를 연결해 빠른 증분 빌드와 깔끔한 패키지 간 타입을 구현합니다. 브라우저에서 직접 실행하는 실습 코드로 TypeScript Academy을(를) 배우며, 24/7 AI 튜터가 강의를 진행하면서 질문에 답변해줍니다.

TypeScript Academy을(를) 시작하는 데 경험이 필요한가요?

사전 경험은 필요하지 않습니다. CoddyKit의 TypeScript Academy은(는) 초급자부터 고급 학습자까지를 위해 구성되어 있으므로, 여기서 시작하거나 처음부터 시작할 수 있으며 자신의 속도대로 진행할 수 있습니다. 이것은 1개 중 1번째 강의입니다.

“모노레포와 프로젝트 참조” 강의는 얼마나 걸리나요?

대부분의 CoddyKit 강의는 약 5~10분이 소요됩니다. 각 강의는 간결하고 인터랙티브하여 꾸준한 진행이 가능하며, 웹과 앱에서 중단한 부분부터 바로 시작할 수 있습니다.

이 TypeScript Academy 강의에서 코드를 작성하고 실행할 수 있나요?

네. 모든 TypeScript Academy 강의에는 내장 코드 에디터가 포함되어 있으므로, 브라우저에서 바로 실제 코드를 작성하고 실행한 후 즉시 AI 피드백을 받을 수 있습니다 — 로컬 설정이 필요 없습니다.

← TypeScript Academy(으)로 돌아가기