فرادرسدیباگ کردن Node.js با ویژوال استودیو کد — راهنمای کاربردی
واقعیت این است که دیباگ کردن Node.js همواره کار دشواری است. اگر تاکنون فرصت کدنویسی یک پروژه در Node.js را داشتهاید، میدانید که یافتن منشأ خطا در این نوع کدها و در نتیجه دیباگ Node.js پیچیدگی و دردسر فراوانی به همراه دارد.
برخلاف کدهای جاوا اسکریپت که در مرورگر دیباگ میشوند و یا کدهای جاوا که با استفاده از یک IDE قوی مانند IntelliJ بررسی میشوند، در Node.js امکان تعیین «نقاط توقف» (breakpoint) در نقاط دلخواه، رفرش کردن صفحه یا راهاندازی مجدد کامپایلر و بررسی گام به گام کد، ارزیابی توابع و یافتن متغیر عوض شده یا مفقود وجود ندارد. همین ناتوانی است که موجب دشواری دیباگ کدهای Node.js شده است.
با این حال، امکان دیباگ وجود دارد و صرفاً به زحمت بیشتری نیاز دارد. در ادامه گزینههای موجود را بررسی کرده و سادهترین روش را معرفی خواهیم کرد.
گزینههای دیباگ کردن Node.js
چند روش برای دیباگ برنامههای مشکلدار Node.js وجود دارد که در ادامه آنها را فهرستبندی کردهایم و لینکهای مربوطه را نیز در صورت نیاز به مطالعه بیشتر ارائه کردهایم.
()Console.log
این روش بارها امتحان خود را پس داده است؛ اما در صورتی که تاکنون کدهای جاوا اسکریپت نوشته باشید باید مقدار بیشتری توضیح بدهیم. این ابزار درون Node.js قرار دارد و همانند ابزار داخلی جاوا اسکریپت که لاگ را در کنسول مرور نشان میداد، موارد مرتبط را در ترمینال نمایش میدهد.
معادل این ابزار در جاوا ()System.out.println و در پایتون ()print نام دارد. ابزار یاد شده سادهترین روش برای پیادهسازی دیباگ است و همچنین سریعترین روش برای آلوده کردن کدهای تمیز به خطوطی از اطلاعات اضافی محسوب میشود. به هر حال این روش در برخی موارد به یافتن و اصلاح خطا کمک میکند.
مستندات Node.js
مستندات Node.js نیز درک کرده است که دیباگ کردن کدها کار آسانی نیست و از این رو یک مرجع کارآمد (+) برای کمک به شروع دیباگ ارائه کرده است.
این ابزار مفید است؛ اما اگر صادقانه سخن بگوییم رمزگشایی از آن به جز برای کسانی که تجربه زیادی در کدنویسی دارند کار دشواری محسوب میشود. بدین ترتیب ممکن است به سرعت در دام مباحثی چون UUID-ها، وبسوکتها و «عوارض امنیتی» بیافتید و دچار سرگیجه شوید. در واقع بهتر بود که در این زمینه از روش غیر پیچیدهتری استفاده میشد.
Chrome DevTools
بخش ابزارهای توسعهدهنده در مرورگر کروم امکان دیباگ کردن کدهای Node.js را فراهم میسازد که به ظاهر روش سادهای محسوب میشود، اما اگر میخواهید این روش را بیازمایید، ممکن است متوجه شوید که نیم ساعت سپری شده است و هنوز نتوانستهاید پنجره DevTools را به برنامه Node وصل کنید. به هر حال به نظر میرسد استفاده از Chrome DevTools برای دیباگ کدهای Node.js پیچیدهتر از آن است که باید باشد.
JetBrains
JetBrains یکی از شرکتهای محبوب توسعه نرمافزار است که IDE-هایی مانند IntelliJ و WebStorm را عرضه کرده است. این شرکت اکوسیستم جالبی از افزونهها برای ابزارهای خود ارائه کرده است.
به لطف جامعه گسترده کاربران JetBrains، مقالات زیادی در حوزههای متفاوت و از جمله دیباگ کردن کدهای Node.js نوشته شده است. اما این مورد نیز همچون مستندات Node و Chrome DevTools آسان نیست. کاربر در این روش باید پیکربندیهای زیادی انجام دهد، پردازشهای اجرایی را الحاق کند و همچنین «ترجیحات» (Preferences) را به مقدار زیادی پیکربندی کند تا WebStorm آماده دیباگ کردن شود.
ویژوال استودیو کد (Visual Studio Code)
این گزینه یکی از سادهترین روشهای دیباگ کردن کدهای Node.js را ارائه کرده است. هر کسی که VS Code را یک بار تجربه کرده، عاشق آن شده است.
VS Code کاری را که هیچ کدام از گزینههای دیگر در خصوص دیباگ کردن کدهای Node.js موفق به انجام نشدند، اجرایی کرده و آن را به فرایندی کاملاً ساده تبدیل کرده است. دیباگ کردن با استفاده از VS Code چنان ساده است که هر کسی میتواند آن را به سرعت راهاندازی و اجرا کند و مهم نیست که چه میزان از آشنایی با IDE-ها، Node و یا برنامهنویسی دارد.
تنظیم ویژوال استودیو کد برای دیباگ کردن کدهای Node.js
در این بخش اقدام به تنظیم VS Code و دیباگ کردن Node.js میکنیم. به این منظور، میبایست قبلاً VS Code را دانلود (+) و نصب کرده باشید. بنابراین در ادامه شروع به تنظیم آن میکنیم.
در نرمافزار VS Code به بخش Preferences > Settings بروید و در کادر جستجو عبارت node debug را وارد کنید. زیر برگه Extensions یک اکستنشن با عنوان «Node debug» ظاهر میشود. در اینجا روی کادر نخست Debug > Node: Auto Attach کلیک کرده و منوی بازشدنی را روی on تنظیم کنید. اینک آماده شروع به کار هستیم.
اکنون به فایل پروژه Node.js خود بروید و با کلیک کردن روی سمت چپ فایل در هر جایی که دوست دارید برخی نقاط توقف را تنظیم کنید. سپس در ترمینال عبارت node --inspect <FILE NAME> را وارد کنید تا عملکرد آن را مشاهده کنید.
دیباگ با VS Code در عمل
اگر به یک پروژه Node.js نیاز دارید که این موارد را تست کنید میتوانید این پروژه (+) را دانلود کنید. این پروژه جهت تست کردن شکلهای مختلف استریم کردن مقادیر بالایی از داده در Node ساخته شده است؛ اما در این دموی ما نیز به خوبی کار میکند. زمانی که کلید Enter را بزنید. بخش انتهایی ترمینال VS Code به رنگ نارنجی در میآید تا نشان دهد که در حالت دیباگ هستید. کنسول نیز پیامی را مبنی بر الحاق دیباگر (‘Debugger Attached’) نمایش میدهد.
زمانی که این وضعیت را مشاهده کردید، بدانید که موفق به دیباگ کردن کدهای Node.js در VS Code شدهاید.
تنظیم نقاط توقف
اینک میتوانید نقاط توقف را در گوشه پایین-چپ صفحه مشاهده کنید. امکان فعال و غیرفعال کردن آنها نیز با انتخاب کادر مربوطه وجود دارد. بدین ترتیب امکان اجرای خط به خط کد و گزینههای step over ،step in ،restart و غیره، همانند زمانی که با استفاده از دکمه Play کوچک در مرورگر اجرا میکردید وجود خواهد داشت. به این منظور باید از دکمههای بخش میانی و بالای IDE استفاده کنید. VS Code نقاط توقف و خطی را که کد در آن متوقف شده است هایلایت میکند تا پیگیری فرایند کار، آسان باشد.
زمانی که با استفاده از دکمههای فوق از یک نقطه توقف به نقطه توقف بعدی حرکت میکنید میتوانید ببینید که برنامه موارد console.log را در کنسول دیباگ در بخش تحتانی ویژوال استودیو کد پرینت میکند و با حرکت به سمت جلو با رنگ زرد هایلایت میشود.
همان طور که میبینید هر چه در برنامه پیش میرویم مواردی که در کنسول دیباگ به نمایش در میآیند افزایش مییابند و در طی این مسیر میتوان اشیا و تابعها را در دامنه محلی با استفاده از ابزارهای گوشه چپ-بالای VS Code دقیقاً همانند روش بررسی موارد مشابه در مرورگر بررسی کرد.
نتیجهگیری
دیباگ کردن Node.js به لطف VS Code دیگر مانند گذشته دشوار نیست و لازم نیست 500 بار ()console.log را در کد خود تکرار کنیم تا بفهمیم که باگ کجا هست. گزینه Debug > Node ویژوال استودیو کد به کمک روش الحاق خودکار پردازش این وضعیت را دگرگون ساخته است.
اگر این مطلب برای شما مفید بوده است، آموزشهای زیر نیز به شما پیشنهاد میشوند:
- مجموعه آموزشهای JavaScript (جاوا اسکریپت)
- مجموعه آموزشهای برنامه نویسی
- آموزش Node.js: مفاهیم مقدماتی
- Node.js چیست؟ — به زبان ساده
- ۷ قابلیت ویژوال استودیو کد برای توسعه دهندگان وب — راهنمای کاربردی
==
