Look Before You Import: A Webpack Survival Guide
summary
Explains migrating from Sprockets to Webpack with concrete failures and fixes: how Webpacker expects entry files in app/javascript/packs, using require.context instead of require_tree, diagnosing duplicate jQuery with the Webpack bundle analyzer, fixing globals via imports-loader instead of expose-loader, and stabilizing fingerprints by extracting the runtime and using HashedModuleIds/CommonsChunkPlugin; shows successful dynamic code splitting via async import (PDF.js example). Choose it if you want hands‑on solutions and config snippets, skip if you only want high‑level overview.
AI-written summary · about
chapters (14)
- 0:00Intro
- 1:01WEBPACK SURVIVAL GUIDE FOR RAILS DEVELOPERS
- 1:46HOW TO WEBPACK WITHOUT LOSING YOUR HAIR
- 2:44ROSS conf
- 13:45Don't assume Webpacker conventions match Sprockets conventions
- 15:27In Webpack, accept control friendliness
- 15:54ORGANIZING CODEV TAMING DEPENDENCIES PREDICTABLE CACHING
- 21:44Quick fix Code splitting? Let Webpack do the work
- 22:47Know your dependencies
- 25:21Legacy dependencies? fix or fire
- 29:43Quick fix More configuration (yay)
- 33:50Prioritize async bundles
- 35:50Webpack and Sprockets: fundamentally different
- 37:23Recording and Production Confreaks
related talks
23mStreamline your code with webpack
30mPackWars: Webpack vs Browserify vs SystemJS vs require.js
34mGift Wrap Your Code with Webpack
26mWebpack: Core Concepts and Advance Topics
40mWebpack for Dummies
19mPerformance Improvements with Webpack
07mIntro to Webpack and Code-splitting for Phoenix
20mWebpack in 5 Years?