فصل دوم: پیکربندی کامپایلر تایپ اسکریپت

TypeScript Compiler

0 131

همانطور که می دانید در تایپ اسکریپت برای کامپایل کردن کدهای تایپ اسکریپت به جاوا اسکریپت از دستور tsc filename.ts استفاده می کردیم به صورتی که به جای Filename باید نام فایل مورد نظر برای کامپایل را بیاوریم. مشکل اینجاست که در پروژه های واقعی شاید ده ها فایل داشته باشیم و نمی توان بعد از هر تغییر کوچک، این دستور را برای هر کدام از آن ها اجرا کرد، این کار بسیار وقت گیر است. جدا از این مشکل، تنظیمات جالب دیگری نیز برای کامپایلر تایپ اسکریپت وجود دارد که مشخص می کند چه چیز هایی کامپایل شود و به چه نسخه ای کامپایل شود و غیره. ما به تمام این تنظیمات دسترسی داریم و در این فصل می خواهم شما را با آن ها آشنا کنم.

اولین کار، خودکار کردن دستور tsc است که اتفاقا عملیات ساده ای دارد. در تایپ اسکریپت حالتی به نام watch mode وجود دارد که با استفاده از آن به تایپ اسکریپت می گوییم فایل های ما را زیر نظر داشته باشد و هنگامی که یکی از فایل ها تغییر کرد، خودش کدها را کامپایل کند تا ما هر بار دستور tsc را اجرا نکنیم. برای انجام این کار باید دستور زیر را در ترمینال خود وارد کنید:

tsc app.ts --watch

با اجرای این دستور فایل app.ts زیر نظر گرفته می شود و با هر بار تغییر عملیات کامپایل شدن خودکار انجام خواهد شد. البته این دستور یک حالت خلاصه نیز دارد که به شکل زیر نوشته می شود:

tsc app.ts -w

هر کدام را که اجرا کنید مشکلی نخواهید داشت. توجه داشته باشید که این حالت مثل سرور مجازی برای رفرش کردن خودکار صفحات ما است، یعنی نباید از ترمینال خود خارج بشوید و گرنه حالت watch mode از بین می رود. بهترین کار استفاده از ترمینال درون خود visual studio code است. در visual studio code ترمینال را از منوی view انتخاب کنید. سپس دستور watch mode را اجرا کنید. حالا اگر می خواهید دستورات دیگری را در ترمینال خود اجرا کنید، علامت مثبت (+) روی ترمینال را بزنید تا ترمینال قبلی باز نگه داشته شده و ترمینال جدیدی برایتان باز شود.

از این به بعد اگر کدی را تغییر داده و فایل را ذخیره کنید (کلیدهای Ctrl + S) کدهای فایل app.ts به صورت خودکار برایتان کامپایل می شوند. در حال حاضر مشکل اینجاست که این روش تنها روی یک فایل خاص تمرکز می کند اما در پروژه های بزرگ تر فایل های بیشتری داریم و نمی توانیم برای تک تک آن ها watch mode ایجاد کنیم. راه حل چیست؟

فرض کنید فایل دیگری نیز داشته باشیم که مخصوص ارسال آمار بازدید بوده و نامش analytics.ts باشد. من فعلا محتوای ساده ی زیر را درون آن قرار می دهم:

همچنین فرض محتویات فایل app.ts نیز به شکل زیر باشد:

حالا به فایل index.html بروید و فایل analytics.ts را نیز درون آن وارد کنید:

هنوز analytics.js وجود ندارد اما بعدا به وجود خواهد آمد. حالا می توانیم به تایپ اسکریپت بگوییم که تمام این فایل ها جز یک پروژه هستند بنابراین باید watch mode را برای تمام پروژه تنظیم کنید. برای انجام این کار باید در ترمینال خود بگویید:

tsc --init

این کار به تایپ اسکریپت می گوید هر جا که این دستور اجرا شد (هر پوشه ای باشد) تمام فایل ها و پوشه های درون آن جزو پروژه ی ما هستند. با اجرای این کد و زدن اینتر یک فایل جدید به نام tsconfig.json ایجاد می شود. اگر این فایل را باز کنید شاهد انواع و اقسام دستورات مختلف خواهید بود که اکثرشان کامنت و غیر فعال شده اند:

ما در این فصل (و تا پایان این دوره) اکثر این گزینه ها را بررسی خواهیم کرد. این گزینه ها مربوط به پیکربندی و تنظیمات کامپایلر تایپ اسکریپت است و فعلا با آن ها کاری نداریم. در حال حاضر این فایل را ببندید و به همان فایل analytics.ts یا app.ts برگردید (یکی از فایل های پروژه). حالا فقط کافی است که دستور زیر را اجرا کنید:

tsc

دیگر نیازی به مشخص کردن فایل های خاص نیست، بلکه با اجرای tsc تمام فایل های این پروژه (در صورت تغییر) دوباره کامپایل می شوند. البته می توانید این دستور را با watch mode ترکیب کنید، یعنی در ترمینال بگویید:

tsc -w

توجه کنید که در دستور بالا نام فایل خاصی را مشخص نکرده ایم بنابراین تمام فایل ها وارد watch mode شده و هر زمان که هر فایلی تغییر کند و ذخیره شود، کدهایش به صورت خودکار کامپایل خواهند شد.

امیدوارم از بحث بررسی ساختار کامپایلر تایپ اسکریپت استفاده ی کافی را برده باشید.

ارسال نظر

توجه:‌ آدرس ایمیل شما منتشر نخواهد شد.

mezitli escort
mezitli escort