آموزش جامع وب‌پک ۴ (Webpack 4) - آخرین آپدیت

مقدمه Introduction

• باندل کردن ماژول‌های جاوااسکریپت با وب‌پک ۴ Bundle JavaScript modules with webpack 4

• پیش‌نیازها و نکاتی که باید بدانید What you should know

1. وب‌پک چیست؟ 1. What Is webpack?

• اجرای وب‌پک Run webpack

• اجرای بیلد با استفاده از webpack.config Run the build with webpack.config

• استفاده از اسکریپت‌های بیلد npm Using npm build scripts

• ویژگی‌های جدید در وب‌پک ۴ چیست؟ What's new in webpack 4?

• وب‌پک دقیقاً چیست؟ What is webpack?

• نصب وب‌پک Install webpack

2. لودرهای وب‌پک 2. webpack Loaders

• لودر (Loader) چیست؟ What is a loader?

• راه‌اندازی babel loader برای پروژه‌های React یا ES6 Set up babel-loader for a React or ES6 project

• استفاده از @babel/preset react Using @babel/preset-react

• استفاده از @babel/preset env Using @babel/preset-env

3. بارگذاری دارایی‌ها (Assets) 3. Load Assets

• استفاده از webpack dev server Using the webpack-dev-server

• بارگذاری CSS با وب‌پک Load CSS with webpack

• بارگذاری تصاویر با وب‌پک Load images with webpack

4. تقسیم کد (Code Splitting) با وب‌پک 4. Code Splitting with webpack

• استفاده از HtmlWebpackPlugin Using the HtmlWebpackPlugin

• آماده‌سازی کد برای محیط Production Prepare code for production

• بهینه‌سازی با SplitChunks Optimize with SplitChunks

• افزودن نقاط ورود (Entry Points) متعدد Add multiple entry points

• تقسیم کد (Code Splitting) چیست؟ What is code splitting?

جمع‌بندی Conclusion

• گام‌های بعدی Next steps