TypeScriptIntermediate
JavaScript থেকে TypeScript-এ রূপান্তর
allowJs, checkJs দিয়ে শুরু, ধাপে ধাপে migration, any সমাধান এবং কাজের কৌশল — বাংলায়।
12টি অংশবাংলা ভাষায়
পুরোনো JavaScript প্রজেক্টকে TypeScript-এ নিতে একদিনে সব করা লাগে না — ধীরে ধীরে migration-এর অনেক উপায় আছে।
allowJs দিয়ে শুরু
tsconfig.jsonjson
json
{
"compilerOptions": {
"allowJs": true,
"checkJs": false,
"noEmit": true
}
}allowJs দিলে .js ফাইলও compile হবে — TS-এ মিশে থাকতে পারবে। checkJs চালু করলে শুধু ভুল ধরা পড়বে, বাধা দেবে না।
ধাপে ধাপে রূপান্তর
- আগে
allowJs: trueওcheckJs: trueচালু করুন — JavaScript-এই টাইপ সমস্যা দেখুন - নতুন ফাইল
.tsনামে লেখা শুরু করুন - একেক module-কে
.js→.tsrename করুন এবং@ts-checkচালু করুন - সবচেয়ে গুরুত্বপূর্ণ ফাংশন/API ফাইলগুলো আগে কভার করুন
any-গুলো ধীরে ধীরে সঠিক টাইপে বদলান- শেষে
noImplicitAnyচালু করুন
সহজ রূপান্তর
// .js
function total(items) {
return items.reduce((sum, item) => sum + item.price, 0);
}
// .ts
interface CartItem {
name: string;
price: number;
}
function total(items: CartItem[]): number {
return items.reduce((sum, item) => sum + item.price, 0);
}any ঠিক করা
// আগে
let data: any = fetchData();
// পরে — union জানা গেলে
type Data = { id: number } | { error: string };
let data: Data = fetchData();
if ("error" in data) {
console.log(data.error);
} else {
console.log(data.id);
}// উদাহরণ: data আসে থার্ড-পার্টি লাইব্রেরি থেকে
interface ApiUser {
id: number;
name: string;
}
const user = (await api.get("/users/1")) as ApiUser;Automated সাহায্য
TypeScript-এর tsc --allowJs --checkJs আর ts-migrate-এর মতো টুলগুলো rewrite-এ সময় বাঁচাতে পারে — তবে প্রতিটি টাইপ নিজে যাচাই করা ভালো।
শেষ প্যারায় নিজে practice করুন — কোড কপি করে নিজের এডিটরে চালিয়ে দেখুন।