Faragiri

همهٔ زبان‌ها

آموزش ماژول و باندلر جاوااسکریپت

بدنه ماژول وارد شده پیش از اولین دستور فایل اصلی اجرا می‌شود. همین یک واقعیت، چند باگ راه‌اندازی را توضیح می‌دهد.

۴بخش
۳دقیقه خواندن
۴عمق

دو سیستم، پنج تفاوت

ماژول استاندارد و ماژول قدیمی Node

هر سطر یک تفاوت رفتاری است و نه یک تفاوت نوشتاری؛ نوشتار فقط نتیجه سطر اول است.

ماژول استانداردساختارش پیش از اجرا مشخص است
ماژول قدیمی Nodeدر زمان اجرا فایل را می‌خواند
کی حل می‌شودپیش از اجرای اولین سطرهمان لحظه‌ای که سطرش اجرا شود
شرطی می‌شودنه، مگر با شکل تابعیبله، هر جای کد
مسیر ساختنینه، باید ثابت باشدبله، رشته را می‌شود ساخت
حذف کد استفاده‌نشدهممکن است، چون ساختار معلوم استممکن نیست
چه چیزی حالتش را تعیین می‌کندپسوند یا فیلد typeهمان دو، از سمت دیگر

هیچ طرفی علامت نخورده، چون هر دو هنوز اجرا می‌شوند. کد تازه با سیستم استاندارد نوشته می‌شود و کد موجود لازم نیست فقط به همین دلیل مهاجرت کند.

یک فایل که سطر اولش یک console.log است و سطر دومش یک import. حدس بدیهی این است که پیام فایل اصلی اول چاپ شود. چیزی که واقعا چاپ می‌شود این ترتیب است:

  • nerkh.mjs body ran
  • main starts

ایمپورت‌های ماژول استاندارد بالا برده می‌شوند: پیش از اجرای هر سطری از فایل شما، همه ماژول‌های وارد شده پیدا، بارگذاری و اجرا شده‌اند. پس هر کدی که در سطح بالای یک ماژول بنویسید، در لحظه‌ای اجرا می‌شود که هنوز هیچ چیزی از برنامه شما راه نیفتاده است.

پیامد عملی‌اش این است که import نمی‌تواند شرطی باشد. نوشتنش داخل یک if اصلا مجاز نیست. اگر واقعا باید بر اساس شرط بارگذاری کنید، شکل تابعی‌اش را بنویسید که یک پرامیس برمی‌گرداند و در همان لحظه اجرا می‌شود.

دو سیستم ماژول، و جایی که به هم می‌رسند

در Node دو سیستم کنار هم زندگی می‌کنند و تفاوتشان فقط نوشتار نیست. سیستم قدیمی‌تر همگام است و در زمان اجرا فایل را می‌خواند، پس می‌شود صدایش را داخل شرط گذاشت و می‌شود مسیرش را در زمان اجرا ساخت. سیستم استاندارد ناهمگام است و ساختارش پیش از اجرا مشخص می‌شود، و دقیقا همین است که به ابزارها اجازه می‌دهد کد استفاده‌نشده را حذف کنند.

کدام یکی فعال است را پسوند فایل یا فیلد type در فایل بسته تعیین می‌کند و نه نوشتار داخل فایل. رایج‌ترین خطای این صفحه هم از همین‌جاست: پیامی که می‌گوید import بیرون از ماژول مجاز نیست، درباره نحو شما نیست، درباره این است که فایل به‌عنوان ماژول شناخته نشده.

باندلر چه کاری می‌کند که مرورگر نمی‌کند

مرورگرهای امروزی ماژول استاندارد را مستقیم می‌فهمند و برای یک صفحه با چند فایل، هیچ ابزاری لازم نیست. باندلر سه کار می‌کند که این را عوض می‌کنند: تعداد درخواست‌ها را کم می‌کند، کدی را که هیچ‌جا وارد نشده حذف می‌کند، و چیزهایی را که مرورگر نمی‌فهمد ترجمه می‌کند. روی یک پروژه با صدها ماژول، کار اول از بقیه مهم‌تر است، چون هر ایمپورت یک رفت‌وبرگشت شبکه است.

همان تقسیم و جمع کردن دوباره، در پایتون شکل دیگری دارد و مرزهایش هم جای دیگری است: نصب کتابخانه، و جدا نگه داشتن پروژه‌ها از هم.

جایی که کار گیر می‌کند، نصب وابستگی‌هاست

یک پروژه فرانت‌اند معمولی صدها بسته در پوشه وابستگی‌ها دارد و نصبشان از یک مخزن بیرونی انجام می‌شود که دسترسی به آن از ایران پایدار نیست. تیم‌ها معمولا یکی از دو کار را می‌کنند: تنظیم یک آینه در فایل پیکربندی بسته‌ساز، یا نگه داشتن کل پوشه وابستگی‌ها در یک آرشیو داخلی. راه دوم زشت است و کار می‌کند. چیزی که در هر دو حالت واجب است فایل قفل است، چون تنها چیزی است که می‌گوید دقیقا چه نسخه‌هایی روی ماشینی که کار می‌کرد نصب بودند.

ابزار، و سالی که این حرف درست است

در سال ۲۰۲۶ Vite انتخاب پیش‌فرض برای پروژه تازه است و جای webpack را گرفته که سال‌ها استاندارد بود؛ متن‌باز و رایگان است و تفاوت عملی‌اش این است که در حالت توسعه اصلا باندل نمی‌کند و همان ماژول‌های استاندارد را به مرورگر می‌دهد، پس شروعش تقریبا آنی است. برای کتابخانه‌ای که قرار است دیگران استفاده کنند، خروجی هر دو سیستم را کنار هم منتشر کنید و در فایل بسته هر دو مسیر را اعلام کنید.

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

کنار این

بالای این