PricingLoginStart free
TypeScript Academy · Pelajaran

Penjelasan Rujukan Projek TypeScript

Gunakan tetapan composite dan references untuk binaan berbilang pakej.

Pelajaran 1 daripada 413 langkah

Penjelasan Rujukan Projek TypeScript ialah pelajaran TypeScript Academy percuma di CoddyKit. Ini ialah pelajaran 1 daripada 4. Anda boleh membaca keseluruhan pelajaran di bawah secara percuma — kemudian berlatih secara praktikal dalam pelayar menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran TypeScript Academy, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus TypeScript Academy merangkumi sejumlah 4 pelajaran.

Apakah Rujukan Projek?

Rujukan projek membolehkan Anda membahagikan pangkalan kod TypeScript kepada beberapa projek tsconfig yang mengisytiharkan kebergantungan antara satu sama lain, sekali gus membolehkan binaan berperingkat dan terasing.

// tsconfig.json (root)
{
  "references": [
    { "path": "./packages/core" },
    { "path": "./packages/ui" }
  ]
}

Projek Komposit

Setiap projek yang dirujuk mesti mempunyai "composite": true dalam tsconfig. Ini membolehkan pengcachean pengisytiharan dan penjejakan kebergantungan.

// packages/core/tsconfig.json
{
  "compilerOptions": {
    "composite": true,
    "declaration": true,
    "outDir": "./dist"
  }
}

Membina dengan tsc --build

Jalankan tsc --build (atau tsc -b) dari akar untuk membina semua projek yang dirujuk mengikut susunan kebergantungan.

# Build all projects
tsc --build

# Build and watch
tsc --build --watch

# Clean build outputs
tsc --build --clean

Binaan Semula Berperingkat

Selepas binaan pertama, tsc --build hanya menyusun semula projek yang fail sumber atau kebergantungannya telah berubah, lalu mempercepatkan repositori besar dengan ketara.

# Only changed packages are rebuilt
tsc --build
# Output: 2/5 projects up to date — skipping

Penggunaan Fail Pengisytiharan

Projek yang dirujuk menggunakan kebergantungannya melalui fail .d.ts yang dijana dalam dist/, bukannya dengan menghuraikan semula fail TypeScript sumber.

// packages/ui imports from packages/core
import { Button } from "@myapp/core"; // resolved via dist/index.d.ts

Konfigurasi Laluan

Sediakan paths dalam tsconfig akar atau gunakan exports dalam package.json supaya TypeScript menyelesaikan import pakej dengan betul semasa pembangunan.

{
  "compilerOptions": {
    "paths": {
      "@myapp/core": ["./packages/core/src/index.ts"]
    }
  }
}

Mengekalkan Susunan Binaan

TypeScript menentukan susunan binaan secara automatik berdasarkan graf rujukan. Rujukan berbentuk kitaran dikesan dan dilaporkan sebagai ralat.

// Circular reference error example:
// packages/core references packages/ui
// packages/ui references packages/core
// Error: Circular project reference

outDir dan rootDir

Setiap projek komposit hendaklah mempunyai outDir dan rootDir yang dikonfigurasikan untuk mengawal susun atur hasil dan mengelakkan fail merentas sempadan pakej.

{
  "compilerOptions": {
    "rootDir": "./src",
    "outDir": "./dist"
  }
}

Penyepaduan dengan Alat Binaan

Turborepo, Nx dan Lerna bersepadu dengan rujukan projek untuk menyimpan binaan dan menjalankannya secara selari berdasarkan graf kebergantungan.

// turbo.json — declare TypeScript build as a pipeline step
{
  "pipeline": {
    "build": { "dependsOn": ["^build"], "outputs": ["dist/**"] }
  }
}

Memantau Berbilang Projek

tsc --build --watch memantau semua projek yang dirujuk dan menyusun semula secara berperingkat pada setiap perubahan, lalu memberikan maklum balas hampir serta-merta dalam monorepositori.

# Terminal: tsc --build --watch
# [9:00:01 AM] Found 0 errors. Watching for file changes.

Imbas Kembali: Rujukan Projek

Rujukan projek membahagikan TypeScript kepada unit binaan yang terasing dan boleh dicache. Tetapkan composite: true, isytiharkan references dan gunakan tsc --build untuk binaan berperingkat yang pantas dan betul dalam monorepositori.

Semakan Pantas

Apakah pilihan tsconfig yang diperlukan supaya sesebuah projek boleh dirujuk oleh projek lain?

Jawab dalam pelajaran interaktif

Perkara yang Anda Pelajari

Rujukan projek TypeScript membolehkan binaan yang pantas dan terasing dalam monorepositori. Konfigurasikan composite: true, isytiharkan kebergantungan melalui references dan bina dengan tsc --build untuk penyusunan berperingkat.

Percuma untuk bermula

Pelajari TypeScript dengan tutor kecerdasan buatan — percuma

Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.

Kursus
101
Pelajaran
352
Mula belajar secara percumaLihat kursus penuh

Soalan Lazim

Adakah pelajaran “Penjelasan Rujukan Projek TypeScript” percuma?

Ya — teks penuh “Penjelasan Rujukan Projek TypeScript” boleh dibaca secara percuma di web ini. Untuk berlatih secara interaktif menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7, serta membuka kunci baki kursus TypeScript Academy, tingkat taraf kepada CoddyKit PRO. Kursus TypeScript Academy merangkumi sejumlah 4 pelajaran.

Apakah yang akan saya pelajari dalam “Penjelasan Rujukan Projek TypeScript”?

Gunakan tetapan composite dan references untuk binaan berbilang pakej. Anda berlatih TypeScript Academy menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.

Adakah saya memerlukan pengalaman untuk memulakan TypeScript Academy?

Tiada pengalaman terdahulu diperlukan. Pembelajaran TypeScript Academy di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 1 daripada 4.

Berapa lamakah pelajaran “Penjelasan Rujukan Projek TypeScript” diambil?

Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.

Bolehkah saya menulis dan menjalankan kod dalam pelajaran TypeScript Academy ini?

Ya. Setiap pelajaran TypeScript Academy menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.

Semua pelajaran dalam kursus ini

  1. Penjelasan Rujukan Projek TypeScript
  2. Ruang Kerja pnpm dengan TypeScript
  3. Strategi Pakej Jenis Dikongsi
  4. Binaan Berperingkat dan Cache dalam Monorepo
← Kembali ke TypeScript Academy