کدهای ماژولار پتانسیل بالایی برای ایجاد خطاهای عجیب و غریب دارند! اگر در مسیر راهاندازی و اجرای ماژولها با مشکل مواجه شدی، اصلاً نگران نباش. در این بخش، ۳ دلیل اصلی کار نکردن ماژولها و راهحلهای فوری آنها را با هم بررسی میکنیم.
اگر از پسوند .mjs برای فایلهای خود استفاده میکنی، این نکته بسیار حیاتی را به خاطر داشته باش:
خطای رایج:
The server responded with a non-JavaScript MIME type
علت و راهحل: سرور شما باید فایلهای ماژول را با هدر هویتی جاوااسکریپت یعنی text/javascript ارسال کند. اگر سرور این هدر را نشناسد، مرورگر به دلیل مسائل امنیتی سختگیرانه، از اجرای کدها جلوگیری میکند. مطمئن شو که تنظیمات سرور یا هاست تو این پسوند را به عنوان جاوااسکریپت میشناسد.
یکی از پرتکرارترین اشتباهات این است که برنامهنویس فایل index.html را مستقیماً با دبلکلیک از روی هارد کامپیوترش در مرورگر باز میکند.
آدرس مرورگر شما: file:///C:/Users/Project/index.html ❌
علت و راهحل: ماژولهای جاوااسکریپت برای امنیت بیشتر، اجازه اجرا روی پروتکل file:// را ندارند و فوراً خطای CORS میدهند. شما حتماً باید کدهایتان را روی یک سرور محلی (Local Server) تست کنید.
پیشنهاد ویژه: سرویس GitHub Pages یک گزینه فوقالعاده برای تست آنلاین است؛ چون هم یک سرور واقعی به شما میدهد و هم فایلهای .mjs را با MIME-type درست ارسال میکند.
.mjsاز آنجا که پسوند .mjs یک پسوند استاندارد و قدیمی برای سیستمعاملها نیست، ممکن است ویندوز یا مک با آن رفتارهای عجیبی نشان دهند!
در برخی سیستمعاملها مثل مک، سیستم به صورت خودکار و پنهانی پسوند .js را به انتهای فایل شما اضافه میکند و خود پسوند را هم مخفی میکند! یعنی شما فایل را به نام math.mjs ذخیره میکنید، اما در پشت صحنه نام واقعی فایل تبدیل میشود به:
❌ math.mjs.js
مرورگر این فایل را پیدا نمیکند و پروژه ارور میدهد.
راهحل: حتماً در تنظیمات سیستمعامل خود (جایی مثل Finder در مک یا File Explorer در ویندوز)، گزینه "مخفی کردن پسوند فایلها" (Hide file extensions) را غیرفعال کنی تا نام واقعی و کامل فایلها را ببینی و این مشکل را برطرف کنی.
این محتوا کاملا رایگان توسط تیم کدلپر ترجمه شده و در اختیار شما کاربران عزیز قرار گرفته است، هر گونه کپی برداری برای مقاصد غیر رایگان و بدون ذکر منبع، مورد پیگیری قانونی قرار میگیرد.
ترجمه شده از منبع: https://developer.mozilla.org/en-US/docs/Web/JavaScript