اگر شما نیز مانند میلیون‌ها برنامه نویس دنیا از ویژوال استدیو کد استفاده می‌کنید حاضرم باهاتون شرط ببندم که حداقل یکی از افزونه‌های بدردنخوری که در این مقاله مشاهده خواهید کرد را استفاده کرده و شاید در حال حاضر به صورت نصب شده نیز داشته باشید.
افزونه‌هایی که امروز از آن‌ها صحبت خواهیم کرد تنها کاری که می‌کنند استفاده از منابع سخت افزاری، کُند کردن ویژوال استدیو و پیچیده کردن همه چیز است. به همین جهت است که ما آن را افزونه‌های بدردنخور می‌نامیم. اما نیازی به نگرانی نیست چرا که بعد از این مقاله متوجه خواهید شد که چرا باید آن‌ها را حذف کرده و دیگر به فکر نصب کردن آن‌ها نباشید.
بیایید ابتدا با فاکتورهای اصلی آشنا شویم که باعث می‌شوند این موارد بدردنخور باشند و آن‌ها را حذف کنیم و سپس سراغ لیست این موارد خواهیم رفت.
دو فاکتور که باعث می‌شوند این افزونه‌ها را حذف کنیم:
- کارکرد تکراری: افزونه‌هایی که ما در این مقاله بررسی خواهیم کرد، تقریبا تمام و کمال همان ویژگی‌های ویژوال استدیو کد را ارائه می‌دهند. البته برخی از این موارد به این دلیل است که ویژوال استدیو کد در نسخه‌های ابتدایی به این افزونه‌ها نیاز داشت، اما با بروزرسانی‌هایی بعدی نیاز به این افزونه‌ها حذف شده است.
- کُند کردن ویژوال استدیو: هر کدام از افزونه‌هایی که نصب و فعال می‌کنید، به میزانی سرعت اجرای ویژوال استدیو کد را کاهش می‌دهد و در نتیجه این موارد نیز به همین شکل قرار است که ویژوال استدیو کد را کُند کنند آن هم بدون اینکه کاربردی داشته باشند.
حال نوبت آن است که سراغ این دست از افزونه‌ها برویم.
افزونه اول: Auto Close Tag
مطمئنا بیشتر توسعه دهندگان بدون ویژگی Auto Close Tag نمی‌توانند به خوبی کدنویسی کنند و سرعت کارهای‌شان را افزایش بدهند. ویژوال استدیو کد از همان ابتدا از این ویژگی پشتیبانی نمی‌کرد و به همین دلیل این افزونه بسیار کاربردی بود. اما حال دیگر در خود ویژوال استدیو کد به صورت پیشفرض از این ویژگی پشتیبانی می‌شود و در نتیجه نیازی به این افزونه نیست.
حتی می‌توانید این ويژگی را از طریق فایل settings.json سفارشی سازی کنید.
{
"html.autoClosingTags": true,
"javascript.autoClosingTags": true,
"typescript.autoClosingTags": true
}افزونه دوم: Auto Rename Tag
داستان این افزونه نیز دقیقا شبیه افزونه قبلی‌ست: ویژوال استدیو کد پیشتر فرایند نامگذاری خودکار تگ‌های جفت شده را انجام نمی‌داد، به همین دلیل است که این افزونه نیز زمانی بسیار مورد استفاده قرار می‌گرفت. حتی جالب است بدانید که در متن معرفی مربوط به این افزونه در Marketplace نوشته شده:
Automatically rename paired HTML/XML tag, same as Visual Studio IDE does.
این جمله در معرفی افزونه اشاره به کاری دارد که خود ویژوال استدیو کد هم می‌تواند اشاره دارد.
برای اینکه این ویژگی را در ویژوال استدیو کد فعال کنید در فایل settings.json تغییر زیر را اعمال کنید.
{
"editor.linkedEditing": true
}افزونه سوم: Bracket Pair Colorizer
این افزونه بیشتر از 7 میلیون بار دانلود شده است و از محبوبیت بسیار بالایی برخوردار است. از حق نگذریم این افزونه زمانی بسیار کاربردی بود چرا که سطوح مختلف پرانتز‌ها، کروشه‌ها و... را با رنگ‌های مختلف نشان می‌داد.
اما همانطور که نویسنده این افزونه به آن اشاره کرده است، این افزونه اکنون به صورت یک ویژگی داخلی در ویژوال استدیو کد وجود دارد و نیازی به نصب آن نیست. برای این کار می‌توانید در فایل settings.json تغییرات زیر را اعمال کنید.
{
"editor.bracketPairColorization.enabled": true,
"editor.guides.bracketPairs":"active"
}افزونه چهارم: Settings Sync
اگر از ویژوال استدیو کد در چندین دستگاه مختلف استفاده می‌کنید و دوست دارید ویژگی‌ها و تغییراتی که در یک دستگاه اعمال می‌کنید روی دیگران نیز اتفاق بیافتد (به صورت خودکار) باید ویژوال استدیو کدها را با همدیگر سینک یا همگام کنید. پیشتر افزونه Settings Sync در این زمینه بسیار کاربردی بود اما اکنون دیگر نیازی به آن نیست چرا که به صورت داخلی این ویژگی در ویژوال استدیو کد پشتیبانی می‌شود. برای این موضوع شما می‌توانید ویژوال استدیو کد را به اکانت گیت‌هاب یا مایکروسافت خود متصل کنید.
افزونه پنجم: Path Intellisense
زمانی از این افزونه بسیار لذت می‌بردم. تمام شورت کات‌ها و میانبرها و کامل کردن کدها به صورت بسیار خوب اتفاق می‌افتاد اما در مستندات نسخه‌های جدید این افزونه گفته شده که ویژگی auto-complete ویژوال استدیو کد را برای استفاده از این افزونه غیر فعال کنید!
سوالی که من دارم این است که چرا از خود ویژگی auto-complete ویژوال استدیو کد استفاده نکنیم؟ مطمئنا با بروزرسانی‌های بسیاری که VSCode داشته، این ویژگی اکنون بسیار قدرتمند است.
افزونه ششم: NPM
این افزونه روشی برای اجرای اسکریپت‌های NPM که در package.json تعریف شده، است. اما حال شما دیگر نیازی به چنین افزونه‌ای ندارید چرا که در ویژوال استدیو کد یک پنل با نام NPM Scripts وجود دارد که می‌توانید همین کار را انجام دهید.
افزونه هفتم: Auto Import
برای مدیریت Importها بسیاری از توسعه دهندگان از افزونه Auto Import استفاده کرده‌اند. اما حال در ویژوال استدیو کد ما می‌توانیم به صورت ویژگی درونی از کارکردهای آن استفاده کنیم. برای این می‌توانیم در فایل settings.json به صورت زیر تغییرات را اعمال کنیم.
افزونه هشتم: HTML Snippets
این افزونه حاوی قطعه کدهای مختلف و میانبرهای HTMLیی‌ست که یک زمان یکی از کاربردی‌ترین افزونه‌ها به شمار می‌رفت. اما اکنون به گفته خود نویسنده این افزونه: بهتر است این افزونه را فورا حذف کنید چرا که با ویژگی‌های ویژوال استدیو کد تداخل دارد.
ویژوال استدیو کد اکنون از Emmet پشتیبانی می‌کند که تقریبا تمام نیازهای شما برای توسعه فایل‌های مبتنی بر HTML را رفع خواهد کرد.
افزونه نهم: Lorem Ipsum
افزونه لورم ایپسوم به شما این قابلیت را می‌دهد که به سرعت در هر کجای کدهای‌تان یک متن فیک را ایجاد کنید. اما این افزونه نیز دیگر بدردنخور به حساب می‌آید چرا که در ویژوال استدیو کد براحتی با نوشتن عبارت lorem و فشردن کلید Enter متن مورد نظرتان آماده خواهد شد.
در پایان
این را بدانید که هر چقدر افزونه‌های اضافی را بیشتر حذف کنید، ویرایشگر سریع‌تر و بهینه‌تری خواهید داشت. بیشتر افزونه‌ها با ویژگی‌های درونی ویژوال استدیو کد مشکل و تداخل دارند. اگر ویژگی خاصی به صورت پیشفرض در ویژوال استدیو کد وجود دارد به نظر نمی‌رسد که نصب کردن افزونه‌های مشابه کار عاقلانه و چندان مناسبی باشد.
اگر به یادگیری عمیق‌تر ویژوال استدیو کد علاقه دارید می‌توانید از دوره رایگان «آموزش VSCode» استفاده کنید. منبع لیست افزونه‌ها
دیدگاه و پرسش
در حال دریافت نظرات از سرور، لطفا منتظر بمانید
در حال دریافت نظرات از سرور، لطفا منتظر بمانید