Webpack... it's amazing! It will change the way you develop, giving you the power to write JavaScript modules, use front-end frameworks and optimize your assets!
But... Webpack is hard! Heck, we created a 3 hour tutorial all about it! That's why Webpack Encore: a library that drastically simplifies Webpack, so you can get back to developing. In this tutorial, we'll cover:
Installing and getting Encore rocking!
Downloading & using external libraries, like jQuery
Using multiple JavaScript entry points
Pre-processing through Sass
Bonus features: enabling React.js, Vue or PostCSS processing
Sourcemaps & versioning
Optimizing with a "shared" commons entry
Handling jQuery plugins
The import & export syntax
production builds
automatic asset versioning
This is going to be a blast: an awesome new asset setup, without the headache!
Overview
Syllabus
- 01. Installing Encore
- 02. Our First Encore
- 03. Require Outside Libraries
- 04. Component Organization
- 05. Multiple Pages / Entries
- 06. jQuery Plugins / Bootstrap
- 07. Require CSS!?
- 08. Handling Images with the CopyPlugin
- 09. Sass & Sourcemaps
- 10. Integrating FOSJsRoutingBundle
- 11. ES6 Import & Export
- 12. Building for Production
- 13. Asset Versioning & Cache Busting
Taught by
Ryan Weaver