0Pricing
TypeScript Academy · บทเรียน

โมโนรีโพและการอ้างอิงโปรเจกต์

สร้างโมโนรีโพในเวิร์กสเปซและเชื่อมการอ้างอิงโปรเจกต์ของ TypeScript เพื่อให้สร้างแบบเพิ่มทีละส่วนได้รวดเร็ว พร้อมชนิดข้อมูลระหว่างแพ็กเกจที่เป็นระเบียบ

โมโนรีโพและการอ้างอิงโปรเจกต์ เป็นบทเรียน TypeScript Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 1 จากทั้งหมด 1 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน 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

พื้นที่ทำงานระดับราก

ประกาศพื้นที่ทำงานเพื่อให้ตัวจัดการแพ็กเกจเชื่อมโยงการพึ่งพาภายในเครื่อง เพิ่มสคริปต์ build/clean โดยใช้โหมดการสร้างของ TS

// 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 สำหรับการพัฒนาในเครื่องแบบเพิ่มทีละส่วน

การตรวจสอบข้อกำหนดของการอ้างอิง

ตรวจสอบอย่างรวดเร็ว: แต่ละแพ็กเกจที่มีการอ้างอิงต้องมีอะไรบ้าง

สรุปทบทวน

สรุปทบทวน: พื้นที่ทำงานจะเชื่อมโยงแพ็กเกจภายในเครื่อง ส่วน การอ้างอิงโครงการ (composite + references) ช่วยให้การสร้างด้วย tsc -b แบบรวดเร็วและเพิ่มทีละส่วนทำได้ พร้อมการตรวจสอบชนิดข้ามแพ็กเกจที่เชื่อถือได้

คำถามที่พบบ่อย

บทเรียน “โมโนรีโพและการอ้างอิงโปรเจกต์” ฟรีหรือไม่

ใช่ — ข้อความเต็มของ “โมโนรีโพและการอ้างอิงโปรเจกต์” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส TypeScript Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส TypeScript Academy มีบทเรียนทั้งหมด 1 บทเรียน

คุณจะเรียนรู้อะไรในบทเรียน “โมโนรีโพและการอ้างอิงโปรเจกต์”

สร้างโมโนรีโพในเวิร์กสเปซและเชื่อมการอ้างอิงโปรเจกต์ของ TypeScript เพื่อให้สร้างแบบเพิ่มทีละส่วนได้รวดเร็ว พร้อมชนิดข้อมูลระหว่างแพ็กเกจที่เป็นระเบียบ คุณปฏิบัติ TypeScript Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน

คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน TypeScript Academy หรือไม่

ไม่จำเป็นต้องมีประสบการณ์มาก่อน TypeScript Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 1 จากทั้งหมด 1 บทเรียน

บทเรียน “โมโนรีโพและการอ้างอิงโปรเจกต์” ใช้เวลานานแค่ไหน

บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย

ฉันเขียนและรันโค้ดในบทเรียน TypeScript Academy นี้ได้ไหม

ได้ บทเรียน TypeScript Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ

← กลับไปที่ TypeScript Academy