یک پروژه ساده جاوااسکریپت بساز که از سینتکس‌های ES6 مثل arrow function، let/const و class استفاده کند و با تنظیمات Babel آن‌ها را به ES5 ترنسپایل کند و خروجی را در پوشه dist قرار بده.

3.0 بازدید آخرین ویرایش در 202 روز قبل ساعت 02:27

0.0

برای حل این تمرین ابتدا یک پوشه پروژه بساز و با npm init یک package.json ایجاد کن، سپس بسته‌های @babel/core، @babel/cli و @babel/preset-env را نصب کن. یک فایل پیکربندی Babel مثل .babelrc یا babel.config.json بساز و preset-env را فعال کن. کد ES6 را در پوشه src بنویس (مثلاً index.js) و در بخش scripts از package.json فرمانی مثل "build": "babel src --out-dir dist --copy-files" اضافه کن؛ سپس npm run build را اجرا کن تا فایل‌های ترنسپایل شده در dist قرار بگیرند. نکات مفید: از --source-maps برای تولید نقشه سورس استفاده کن، node_modules را نگذار ترنسپایل شود و برای پشتیبانی از APIهای جدید به polyfill نیاز داشته باشی از core-js و تنظیمات useBuiltIns در preset-env استفاده کن.

توسط پژوهشگر در 202 روز قبل ساعت 02:27
دسته بندی ها: JavaScript JavaScript for beginner
sara در 202 روز قبل ساعت 09:37

برای پشتیبانی از APIهای جدید جاوااسکریپت، از preset-env با core-js و استفاده از option های useBuiltIns: 'usage' بهره بگیرید تا فقط پلی‌فیلس لازم اضافه شوند. در فرایند BUILD از --source-maps استفاده کنید تا نقشه سورس برای دیباگ ساده باشد. همچنین برای جلوگیری از ترنسپایل node_modules، از گزینه ignore یا ignore در babel.config.json استفاده کنید. با اجرای npm run build خروجی‌ها به dist منتقل می‌شوند و اگر از --copy-files استفاده کنید، فایل‌های غیر js هم کپی می‌شوند.

گزارش

1 پاسخ

جدید ترین قدیمی ترین بالاترین امتیاز پاسخ های من

در حال بارگیری...
ورود به حساب کاربری