В этом видео мы погрузимся в процесс работы с библиотекой three.js в уже собранном проекте при помощи инструмента webpack. Мы изучим, как настроить окружение разработки, чтобы быстро просматривать и тестировать наши трехмерные проекты. Вы узнаете, как настроить dev-server и использовать горячую перезагрузку (hot reload) для мгновенного обновления изменений в вашем проекте. Кроме того, мы также рассмотрим процесс сборки и оптимизации вашего приложения для продакшена с помощью webpack, чтобы получить максимальную производительность и эффективное использование ресурсов.
••••••••••••••
0:00 Зачем нам другая сборка?
1:17 Создаем структуру папок
2:06 Инициализация проекта и установка пакетов
2:40 Создание конфигураций webpack
5:55 Настройка скриптов и запуск
••••••••••••••
Ресурсы, про которые я говорила в ролике:
⚪️ NodeJS: [nodejs.org](nodejs.org/en)
⚪️ Webpack: [webpack.js.org](webpack.js.org/)
👾 Исходный код: github.com/GuVictory/threejs-...
Пакеты, которые я устанавливала в видео:
npm install webpack webpack-cli webpack-dev-server webpack-merge clean-webpack-plugin copy-webpack-plugin @babel/core @babel/preset-env babel-loader css-loader file-loader html-loader html-webpack-plugin mini-css-extract-plugin portfinder-sync raw-loader style-loader ip --save-dev
••••••••••••••
✈️ Telegram канал проекта: t.me/WebDevSandbox
☕️ Угостить меня кофе: boosty.to/guvictory/donate
🦄 Boosty подписка на доступ к текстовым материалам: liba.ro/5z6e97xge
🔥 Boosty подписка на доступ к текстовым материалам и коммьюнити: liba.ro/5z6e9l5h4
Спасибо за внимание ♥︎
Негізгі бет Сборка проекта с three.js с помощью webpack: настройка дева и прода
Пікірлер: 23