#

Webpack 4

آموزش Webpack 4

[دوره] در این دوره ی آموزشی با ابزار قدرتمندی به نام Webpack آشنا می شویم. بسیاری از کارهایی که در هنگام توسعه انجام می دهیم تکراری هستند و هرکدام نیاز به ابزار مختلفی برای اجرا دارند. برای مثال هربار نیاز داریم تا فایل های sass را تبدیل به css کنیم, ES6 را به ES5 تبدیل کنیم, حجم فایل ها را کم کنیم و خیلی...

Bonus - Webpack in React

[اپیزود] در این ویدیو config خیلی ساده‌ای از webpack رو روی پروژه‌ی React اجرا می‌کنیم. این کار به برطرف شدن بعضی از نقطه‌های گنگی که موقع استفاده از webpack وجود دارند کمک میکنه. همچنین پایه‌ای میشه برای ساختن configهای قوی و شخصی‌سازی شده‌ی خودتون.

Work With Other File Types

[اپیزود] webpack توانایی این رو داره تا با انواع مختلف فایل‌ها کار کنه. به همین دلیل توی این ویدیو نگاه سریعی به بعضی از انواع فایل‌هایی که بررسی نکردیم میندازیم تا با نحوه‌ی برخورد webpack با فایل‌ها بهتر آشنا بشیم.

Separate Config Files

[اپیزود] هنگام توسعه‌ی کد(development mode) نیازی نداریم تا تمام فعالیت‌هایی که برای خروجی اصلی کد(production mode) لازم هستند اجرا بشن(و همینطور برعکس). به جای اینکه برای هربار جابجا شدن بین این دو mode نیاز به تغییر فایل config داشته باشیم، میتونیم از دو فایل یا چند فایل config جدا برای خروجی&zwn...

Run DevServer

[اپیزود] یکی از ابزارهایی که برای توسعه نیاز داریم، serverی هست که بتونیم روی اون روند اجرای کدهامون رو شبیه سازی کنیم. با استفاده از packgeی به اسم webpack-dev-server توانایی این کار رو به webpack اضافه می‌کنیم.

Hash File Names

[اپیزود] در webpack این قابلیت رو داریم که اسم فایل خروجی رو تعیین کنیم. همچنین میتونیم در هربار تغییر مقدار hash رو به این اسم‌ها اضافه کنیم.

Optimize Images

[اپیزود] در این ویدیو با packageی برای optimze کردن عکس‌ها آشنا میشیم و میتونیم به جای نرم‌افزارها و وبسایت‌های مختلفی که برای این کار هستند٬ از اون استفاده کنیم.

Load Images

[اپیزود] برای اینکه برای webpack نحوه‌ی برخورد با فایل‌های عکس رو هم تعریف کنیم٬ می‌تونیم از packageی به اسم url-loader استفاده کنیم. با استفاده از این package اگر حجم تصویر از حد خاصی کمتر باشه٬ به صورت base-64 به صفحه اضافه میشه٬ در غیر این‌صورت به صورت فایل در خروجی قرار میگیره و آدرس...