مهدی قاسمی (هُمام)
مهدی قاسمی (هُمام)
خواندن ۵ دقیقه·۵ سال پیش

تریک‌های ابتدایی و دم دستی در VSCode - قسمت اول

تصویر از نتایجه سرچ گوگل برای VSCode
تصویر از نتایجه سرچ گوگل برای VSCode

ادیت 1:

تصمیم داشتم همین پست رو آپدیت کنم ولی چون خیلی طولانی می‌شد، تصمیم گرفتم قسمت دیگه‌ای بهش اضافه کنم که آدرسش رو همین جا اضافه میکنم.

قسمت دوم مقاله

ادیت 2:

یکی از دوستان (SherlockMac عزیز) یکی دو مورد رو در کامنت اصلاح کردند، که اون تغییرات رو اضافه کردم.

1- روش نوشتن vsCode رو به VSCode دادم.
2- کلمه «پیش پا افتاده» در عنوان به ابتدایی تغییر کرد.
3- در مورد استفاده در مک هم توضیح دادند که می‌تونید تو کامنت‌ها بخونید.

یه سری تریک خیلی ساده تو VSCode که احتمالا همگی بلدید رو امروز یه چند تاییش رو برای دوستان و همکاران گفتم و بعضی هاش رو نمی‌دونستند، گفتم امروز چند تا بنده هم اینجا پیدا کنم :)

چند تا نکته ریز:
1- پیشاپیش ببخشید اگر خیلی پیش پا افتاده است.
2- دونستن یا ندونستن این تریک‌ها (نمیگم حقه یا کلک چون بار معناییش برام منفیه) کسی رو دولوپر یا برنامه‌نویس نمیکنه یا از سوادش کم نمیکنه، خودم خیلی‌هاش رو اتفاقی دیدم، دونستن این‌ها صرفا ممکنه یکمی سرعتتون رو بالا ببره، مخصوصا وقتی مثل من سرعت کد نوشتن و فکر کردنتون روی کد کم باشه، اینجوری میتونید یه مقداریش رو جبران کنید.
3- خوشحال میشم اگر چیزی زیرش اضافه کنید که مابقی هم استفاده کنند، تو ادیت های بعدی زیر همین‌ها اضافه میکنم.
4- شورت‌کی‌هایی که گفته می‌شه همه ویندوزی هستند، چون خودم کاربر ویندوز هستم ولی عموما به راحتی قابل تبدیل برای کاربرهای لینوکس و مک هستند.

و اما تریک‌ها:

1- اگر Alt + Click کنید در قسمت های مختلف کد می‌تونید Multiple Cursor داشته باشید و یه چیزی رو در چندین محل تایپ، پیست یا پاک کنید؛ یا حتی سلکت و کپی کنید که همشون به شکل یه استرینگ شامل همه چیزایی که کپی کردید می‌ره تو کلیپ برد.

2- اگر یه استرینگ رو سلکت کنید و Ctrl + Shift + L رو بزنید همه استرینگ‌های مشابهش رو توی همون داکیومنت به صورت مالتیپل کرسر سلکت می‌کنه و می‌تونید ادیتش کنید. مثلا وقتی که میخواید یه کلاس CSS رو همه جا تو داکیومنت یه چیزی بهش کم یا زیاد کنید

3- اگر یه استرینگ رو سلکت کنید و Ctrl + D بزنید با هر بار زدن اولین استرینگ مشابهش رو توی داکیومنت سلکت می‌کنه و وقتی برسه به انتها از ابتدا شروع می‌کنه و باز هم می‌تونید مثل همون قبلی مالتیپل کرسر داشته باشید.

4- اگر اسم یه کلاس، متد، پراپرتی یا امثالهم رو تو جاوااسکریپت یا تایپ اسکریپت بخواهید عوض کنید، توی یه داکیومنت میتونید سلکتش کنید و F2 رو یزنید و تغییری رو که میخواید بدید، همه جا تو همون داکیومنت تغییر میکنه

5- با Ctrl + B منوی بغل باز و بسته می‌شه

6- با Ctrl + \ می‌تونید پنجره های کنار هم باز کنید و بعد با Ctrl + 1-n بین پنجره‌ها سوییچ کنید.

7- این هم بد نیست: Ctrl + 0 برای فوکوس روی منوی بغل هست و بصورت اختصاصی Ctrl + Shift + E برای فوکوس روی منوی فولدرهاست.

8- با Ctrl + 0 می‌تونید فوکوس رو از روی ادیتور ببرید روی منوی بغل و برعکس

9- برای سوییچ کردن روی تب های مختلف در هر ویو می‌تونید از Ctrl + PgUp یا Ctrl + PgDn استفاده کنید

10- از Ctrl + Tab برای سوییچ کردن روی تب قبلی استفاده کنید، اگر نگه دارید می‌تونید با کلیدهای بالا و پایین از بین فایل‌های باز یکی رو انتخاب کنید، با نگه داشتن Ctrl و زدن متناوب Tab هم می‌تونید این کار رو بکنید.

11- با Ctrl + ` می‌تونید ترمینال رو باز کنید یا ببندید، نکته‌اش اینجاست که اگر ترمینال باز باشه ولی فوکوس روش نباشه با یه بار زدن، فوکوس میره روش و با بار دوم بسته میشه، البته ترمینال کیل نمیشه و برای کیل کردنش باید روی اون سطل آشغال بغل کلید کنید، اگر دوست داشتید می‌تونید برای اینکه از ماوس استفاده نکنید خودتون یه شورت‌کی براش درست کنید، من خودم Ctrl + Shift + X رو استفاده می‌کنم.

12- برای درست کردن شورت‌کی هم می‌تونید Ctrl + K و بلافاصله Ctrl + S رو بزنید تا ادیتور شورت‌کی باز بشه، بعد برای workbench.action.terminal.kill جستجو کنید و هر شورت‌کی که می‌خواید رو اضافه کنید، اگر شورت‌کی تداخل داشته باشه بهتون می‌گه.

این دو مورد بعدی تقریبا در تمام ادیتورها و IDEها یکسان یا با تغییرات جزیی قابل استفاده است.

13- وقتی یه چیزی رو سرچ کردید با Ctrl + F یا با Ctrl + Shif + F می‌تونید با زدن F3 برید رو نتایج بعدی و با Shift + F3 روی نتایج قبلی

14- شورت‌کی Ctrl + Shift + F کمکتون می‌کنه تو همه پروژه سرچ کنید، ممکنه به ذهنتون برسه که مثلا من یه کلاس CSS رو می‌خوام ولی اون نتایج رو توی همه فایلهای HTML, SCSS, TS, JS برام میاره، کافیه تو فیلتر با استفاده از وایلد کاردها فایل مد نظر یا آدرس رو محدود کنید مثلا

*.tsx
*.scss
styles/**/_*.scss

که آخری توی فولدر styles همه زیر فولدرها فایلهای SCSS که با آندر اسکور شروع میشن رو توش سرچ می‌کنه


vscodeکدنویسیکد نویسیکد
Front-End Developer with an appetite to do everything with CSS even in the real world.Completely disappointed with his country's future.
شاید از این پست‌ها خوشتان بیاید