شما به ابزار اشکال زدایی خارجی نیاز ندارید. می توانید برنامه های Node.js خود را درست در ویرایشگر VS Code با استفاده از ابزار داخلی آن اشکال زدایی کنید.
اشکال زدایی برنامه Node.js در کد ویژوال استودیو ممکن و ساده است. ویرایشگر VS Code دارای یک دیباگر داخلی است که می‌تواند هر برنامه‌ای را که زمان اجرا Node.js را هدف قرار می‌دهد، اشکال زدایی کند. این بدان معنی است که می توانید جاوا اسکریپت یا هر زبان دیگری را که به آن کامپایل می شود (به عنوان مثال TypeScript) اشکال زدایی کنید.
این مقاله شما را با مراحل اشکال زدایی برنامه Node.js در VS Code آشنا می کند. شما یاد خواهید گرفت که چگونه یک جلسه اشکال زدایی را شروع کنید، نقاط شکست را درج کنید، یک فرآیند خارجی را پیوست کنید و کد TypeScript را با استفاده از نقشه های منبع اشکال زدایی کنید.
آنچه برای شروع نیاز دارید
قبل از شروع، Node.js و VS Code را روی دستگاه محلی خود نصب کنید. آخرین نسخه Node.js در وب سایت رسمی Node.js موجود است. به همین ترتیب، برای Visual Studio Code، آخرین نسخه را از وب سایت VS Code دانلود کنید. برای راهنمایی در مورد نحوه تنظیم VS Code در ویندوز، راهنمای نصب ما را بخوانید.
شما همچنین به یک پروژه Node.js نیاز دارید. می توانید یک برنامه ساده Node.js را از ابتدا ایجاد کنید یا از یک برنامه موجود استفاده کنید.
فرآیند اشکال زدایی در VS Code
شروع یک جلسه اشکال زدایی در ویرایشگر VS Code بسیار ساده است. فایل را با VS Code باز کنید و روی نماد Run and Debug در نوار کناری کلیک کنید (یا Ctrl + Shift + D را روی صفحه کلید خود فشار دهید). سپس روی دکمه Run and Debug کلیک کنید تا فرآیند شروع شود.
به طور پیش فرض، Node.js سعی می کند محیط اشکال زدایی پروژه شما را کشف کند. اما اگر تشخیص خودکار ناموفق باشد، از شما می خواهد که محیط مناسب را انتخاب کنید. برای این آموزش، آن محیط Node.js است.
پس از اینکه محیط را انتخاب کردید، VS Code دیباگر را فعال می کند و آن را به فرآیند متصل می کند. می توانید خروجی خود را در DEBUG CONSOLE ببینید. با استفاده از نوار ابزار اشکال زدایی در بالا، می توانید کد را تکرار کنید، اجرا را متوقف کنید یا جلسه را پایان دهید.
شما همچنین می توانید یک فایل پیکربندی ایجاد کنید. فایل launch.json به شما امکان می دهد جزئیات اشکال زدایی را پیکربندی و تنظیم کنید. اگر اسکریپت شما به آرگومان نیاز دارد، این آرگومان ها را در فایل launch.json وارد کنید. چندین گزینه را می توان در هر پیکربندی تنظیم کرد:
{
"version": "0.2.0",
"configurations": [
{ "type": "node",
"request": "launch",
"name": "Launch Program",
"skipFiles": [ "<node_internals>/**" ],
"program": "${workspaceFolder}\\index.js"
}
]
}
شما همچنین متوجه پنج پانل در سمت چپ ویرایشگر خواهید شد. این پانل ها عبارتند از VARIABLES، WATCH، CALL STACK، LOADED SCRIPTS و BREAKPoints:
وقتی تنظیمات پیکربندی را تمام کردید، برنامه را از طریق منوی پیکربندی انتخاب و اجرا کنید.
یک فرآیند خارجی را ضمیمه کنید
روش دیگر برای تنظیم یک جلسه اشکال زدایی Node.js، پیوست کردن یک فرآیند خارجی است. برنامه را با دستور زیر شروع کنید:
node --inspect index.js
اگر می‌خواهید قبل از شروع برنامه اجرا شود، پرچم -brk را بعد از –inspect وارد کنید.
بعد، انتخابگر فرآیند را در VS Code باز کنید. این لیست تمام فرآیندهای موجود در محیط Node.js را نشان می دهد. برای باز کردن انتخابگر، Ctrl + Shift + P را فشار دهید و دستور Debug: Attach to Node.js را پیدا کنید.
بر روی دستور کلیک کرده و گزینه مناسب را برای شروع فرآیند دیباگ انتخاب کنید.
ایجاد نقطه شکست
اگر می خواهید در نقاط خاصی از برنامه خود مکث کنید تا کد را بررسی کنید، نقاط شکست را در آنجا تنظیم کنید. تقریباً در هر نقطه از کد خود می توانید نقاط شکست را تعیین کنید. این شامل اعلان متغیرها، عبارات و نظرات می شود. اما شما نمی توانید نقاط شکست را در اعلان های تابع تعیین کنید.
ایجاد نقطه شکست بسیار ساده است. همانطور که ماوس خود را به سمت چپ اعداد خطوط می‌برید، یک دایره قرمز رنگ روی هر خط ظاهر می‌شود. شماره خط را در کد خود که می خواهید نقطه شکست را در آن وارد کنید، شناسایی کنید. سپس روی آن خط کلیک کنید تا نقطه شکست اضافه شود:
در پنجره BREAKPOINTS، تمام نقاط شکست فعال در پروژه خود را خواهید یافت. اینجا جایی است که نقاط شکست را مدیریت، ویرایش و غیرفعال می‌کنید. همچنین می‌توانید در هنگام پرتاب کردن یک استثنا یا در مواردی که استثنائات کشف نشده است، کد را متوقف کنید. این به شما امکان می دهد تا قبل از خروج از فرآیند، مشکل را بررسی کنید.
بیایید نقاط شکست را در عمل ببینیم. برای شروع جلسه اشکال زدایی، روی نماد راه اندازی کلیک کنید. برنامه در اولین نقطه شکست متوقف می شود و مقدار مورد نظر را برای بازرسی به دست می دهد:
می توانید روی نماد Continue کلیک کنید (یا F5 را فشار دهید) تا برنامه به نقطه شکست بعدی منتقل شود. این کار تا زمانی که به انتهای برنامه برسید ادامه خواهد داشت.
اشکال زدایی TypeScript با نقشه های منبع
همانطور که تایپ اسکریپت همچنان به محبوبیت بیشتر خود ادامه می دهد، تعداد پروژه های Node.js که در TypeScript نوشته می شوند، مسلماً افزایش می یابد. خوشبختانه، شما همچنین می توانید پروژه های مبتنی بر TypeScript را با VS Code اشکال زدایی کنید.
ابتدا یک فایل tsconfig.json در دایرکتوری ریشه پروژه خود ایجاد کنید (اگر قبلاً ایجاد نشده باشد) و نقشه های منبع را فعال کنید:
{ "compilerOptions": { "sourceMaps": true }}
سپس، فرآیند در حال اجرا را پیوست کنید و نقاط شکست را در فایل TypeScript خود تنظیم کنید. Visual Studio Code نقشه های منبع را پیدا کرده و از آنها استفاده می کند.
شما می توانید به صراحت به VS Code بگویید نقشه های منبع را کجا پیدا کند. برای انجام این کار، یک ویژگی outFiles را در فایل پیکربندی راه اندازی خود اضافه کنید و آن را به مکان دقیق نقشه های منبع خود نشان دهید:
{
"version": "0.2.0",
"configurations": [ {
"type": "node",
"request": "launch",
"name": "Launch Program",
"skipFiles": [ "<node_internals>/**" ],
"program": "${workspaceFolder}\\index.js",
"outFiles": "${workspaceFolder}\\index.js",
}
]
}
اگر از ts-node برای اجرای پروژه خود بدون مرحله ساخت استفاده می کنید، به جای پیکربندی بالا از این استفاده کنید:
{
"version": "0.2.0",
"configurations": [ {
"type": "pwa-node",
"request": "launch",
"name": "Launch Server",
"skipFiles": [ "<node_internals>/**" ],
"runtimeArgs": [ "-r", "ts-node/register" ],
"args": [ "${workspaceFolder}/src/server.ts" ]
}]
}
از آنجایی که هیچ ویژگی برنامه ای وجود ندارد، args در زمان اجرا ts-node را به عنوان کنترل کننده فایل های TypeScript ثبت می کند. اولین آرگومان برای args، فایل ورودی برنامه است. اکنون می توانید جلسه اشکال زدایی خود را شروع کنید. اگر در حال توسعه با جاوا اسکریپت وانیلی یا فریم ورک فرانت اند هستید، می توانید کد جاوا اسکریپت را در مرورگر اشکال زدایی کنید.
سایر ویژگی های Visual Studio Code
Visual Studio Code یک ویرایشگر کد منبع قدرتمند با ویژگی های شگفت انگیز است. ما ابزار رفع اشکال داخلی VS Code را پوشش دادیم. ما همچنین نشان دادیم که چگونه می توانید از آن برای اشکال زدایی برنامه Node.js خود استفاده کنید.
اما بسیاری از ویژگی های مفید دیگر در VS Code وجود دارد. در حالی که ممکن است با برخی از آنها آشنا باشید، برخی ممکن است برای شما کاملاً جدید باشند. در این صورت، ممکن است برای شما جالب باشد که در مورد این ویژگی ها و نحوه استفاده از آنها بیاموزید.