Основы Webpack 4

Освойте ключевые концепции Webpack 4 и узнайте, как эффективно собирать, оптимизировать и доставлять фронтенд‑код. Этот курс поможет вам уверенно работать со сборщиком, который лежит в основе множества современных высокопроизводительных веб‑приложений.

Что вы изучите в этом курсе

Курс фокусируется на практическом освоении Webpack 4 — от базовой настройки до применения продвинутых оптимизаций. Каждая тема подкреплена реальными примерами, чтобы вы могли сразу применять знания в собственных проектах.

Базовая конфигурация Webpack

Вы начнёте с установки Webpack через npm и узнаете, как правильно организовать конфигурационные файлы в проекте.

• Добавление Webpack в проект
• Настройка режима разработки и production
• Создание базового файла webpack.config.js

Разделение окружений

Вы научитесь разделять конфигурации для разработки и продакшена, чтобы оптимизировать сборку, размер бандла и скорость разработки.

• Использование webpack-merge
• Настройка sourcemaps
• Минификация и оптимизация кода

Оптимизация и разбиение кода

Современные приложения требуют быстрой загрузки. Разбиение кода помогает загружать только то, что нужно пользователю здесь и сейчас.

• Ленивая загрузка модулей (lazy loading)
• Динамический импорт
• Настройка SplitChunks для оптимизации бандлов

Работа с загрузчиками и плагинами

Webpack силён благодаря экосистеме loader'ов и плагинов. Вы освоите управление конвейером сборки с помощью самых популярных инструментов.

• Настройка babel-loader, css-loader, style-loader
• Использование HtmlWebpackPlugin
• Оптимизация ассетов и изображений

Полезные материалы курса

Вы получите доступ к дополнительным ресурсам, которые помогут глубже понять работу Webpack 4.

• Презентация к курсу
• Репозиторий с примерами

Важно: Видео доступно в формате .webm и корректно работает в браузере Google Chrome.