TypeScript o'rnatish va tsc kompilyatori

Oldingi darsda TypeScript xatoni ishga tushirishdan oldin topishini ko’rdingiz. Endi shu tekshiruvni o’z kompyuteringizda ishlatasiz.

Bu darsda hamma narsa terminalda bo’ladi: vosita o’rnatiladi, sozlama fayli yaratiladi va birinchi .ts fayl JavaScript’ga aylantiriladi.

Tayyorgarlik: Node.js

TypeScript kompilyatori Node.js ustida ishlaydi. Terminalda tekshiring:

node --version
npm --version

Kutilgan natija (raqamlar sizda boshqacha bo’lishi mumkin):

v24.14.1
11.11.0

Ikkala buyruq ham versiya qaytarsa, tayyorsiz. Xato chiqsa, nodejs.org saytidan LTS belgili versiyani o’rnating va terminalni qayta oching.

1-qadam: loyiha papkasini yaratish

mkdir ts-start
cd ts-start
npm init -y

npm init -y buyrug’i package.json faylini savolsiz yaratadi:

Wrote to .../ts-start/package.json

{
  "name": "ts-start",
  "version": "1.0.0",
  "main": "index.js",
  ...
}

2-qadam: TypeScript’ni o’rnatish

npm install --save-dev typescript

added 1 package, and audited 2 packages in 3s

found 0 vulnerabilities

O’rnatilganini tekshiring:

npx tsc --version

Version 5.9.3

3-qadam: birinchi TypeScript fayli

src papkasini yarating va ichiga greet.ts faylini joylang:

mkdir src

src/greet.ts:

function greet(userName: string): string {
  return `Salom, ${userName}!`;
}

console.log(greet("Aziz"));

userName: string — parametr matn bo’lishi kerak. Qavsdan keyingi : string — funksiya matn qaytarishini bildiradi.

4-qadam: tsconfig.json

Har safar buyruqqa fayl nomi va sozlamalarni yozmaslik uchun sozlama fayli yaratiladi. Loyiha ildizida tsconfig.json:

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "nodenext",
    "rootDir": "src",
    "outDir": "dist",
    "strict": true
  },
  "include": ["src"]
}

Sozlama	Vazifasi
target	Qaysi JavaScript versiyasiga aylantiriladi
module	Modul tizimi qaysi uslubda yoziladi
rootDir	Manba fayllar qayerda turadi
outDir	Natija qayerga yoziladi
strict	Qat’iy tekshiruv rejimi
include	Qaysi papka tekshiriladi

5-qadam: kompilyatsiya

npx tsc

Buyruq jim tugaydi — hech narsa yozmaydi. TypeScript’da jimlik yaxshi xabar: xato topilmadi degani.

Natijani ko’ramiz:

ls dist

greet.js

dist/greet.js ichida oddiy JavaScript turadi:

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
function greet(userName) {
    return `Salom, ${userName}!`;
}
console.log(greet("Aziz"));

Tiplar yo’qolgan. Faylni ishga tushiring:

node dist/greet.js

Salom, Aziz!

6-qadam: xatoni ataylab yasang

Tekshiruv haqiqatan ishlayotganiga ishonch hosil qiling. src/greet.ts oxiriga bitta qator qo’shing:

function greet(userName: string): string {
  return `Salom, ${userName}!`;
}

console.log(greet("Aziz"));
console.log(greet(42));

npx tsc

src/greet.ts(6,19): error TS2345: Argument of type 'number' is not assignable to parameter of type 'string'.

Xabarni qismlarga ajratamiz:

Qism	Ma’nosi
src/greet.ts	Qaysi fayl
(6,19)	6-qator, 19-ustun
TS2345	Xato raqami — internetda qidirsa bo’ladi
Matn	Nima mos kelmadi

Endi eng muhim qismi: dist/greet.js yangilanmadi. Xato topilganda kompilyator natija yozmaydi. Ya’ni buzuq kod tayyor papkaga o’tmaydi.

Xato qatorini o’chiring va npx tsc ni qayta yuriting — buyruq yana jim tugaydi.

Faqat tekshirish: –noEmit

Ba’zan fayl yaratish kerak emas, faqat tekshiruv kerak bo’ladi:

npx tsc --noEmit

--noEmit — “tekshir, lekin hech narsa yozma” degani. Bu bayroq kodni saqlashdan oldin tezda tekshirish uchun qulay.

Kuzatuv rejimi: –watch

Har o’zgarishdan keyin buyruq berish zeriktiradi. --watch bayrog’i fayllarni kuzatib turadi:

npx tsc --watch

[10:24:01] Starting compilation in watch mode...

[10:24:03] Found 0 errors. Watching for file changes.

Endi .ts faylni saqlaganingizda kompilyatsiya o’zi qayta ishlaydi. Xato bo’lsa terminalda darhol ko’rinadi. To’xtatish uchun Ctrl+C.

package.json skriptlari

Buyruqlarni yozib qo’ying, shunda ularni eslab yurish shart emas:

{
  "scripts": {
    "check": "tsc --noEmit",
    "build": "tsc",
    "start": "node dist/greet.js"
  }
}

Ishlatilishi:

npm run check
npm run build
npm start

Skript ichida npx yozilmaydi: npm mahalliy node_modules ni o’zi biladi. npm va package.json darsida bu mexanizm batafsil ko’rilgan.

Amaliy mashq

1. ts-start papkasini yaratib, npm init -y va npm install --save-dev typescript buyruqlarini bajaring;
2. npx tsc --version bilan o’rnatilgan versiyani tekshiring;
3. tsconfig.json yaratib, rootDir va outDir ni to’ldiring;
4. src/greet.ts yozib, npx tsc bilan kompilyatsiya qiling va dist/greet.js ichidagi tiplar yo’qolganini ko’ring;
5. Funksiyaga songa mo’ljallangan joyga matn berib, xato xabaridagi qator va ustun raqamini toping;
6. npx tsc --watch ni yoqib, faylni saqlagan zahoti kompilyatsiya qayta ishlashini kuzating.

5-qadam eng muhimi: xato topilganda dist yangilanmasligini o’z ko’zingiz bilan tekshirasiz — aynan shu xususiyat buzuq kodni tayyor papkadan uzoq tutadi.

Qisqacha xulosa

• TypeScript loyihaga npm install --save-dev typescript bilan o’rnatiladi va npx tsc orqali chaqiriladi.
• tsconfig.json sozlamalarni bir joyda saqlaydi; rootDir va outDir juft yoziladi.
• strict: true birinchi kundan yoqiladi — keyinroq yoqish qiyin.
• npx tsc jim tugasa, xato yo’q degani.
• Xato topilganda natija fayli yangilanmaydi — buzuq kod dist ga o’tmaydi.
• --noEmit faqat tekshiradi, --watch o’zgarishlarni kuzatib turadi.
• Hosil qilinadigan dist papkasi .gitignore ga qo’shiladi.

Keyingi darsda asosiy tiplar — string, number, boolean va bo’sh qiymatlar bilan ishlash.