ES6 Modules in the Real World
summary
ES6 modules are production ready in modern browsers and enable faster edit refresh cycles and a clean modern code path while older browsers get an ES5 fallback via transpilation. Recommended toolchain uses Rollup to bundle and tree shake then Babel to transpile for legacy targets. Practical details include the nomodule/Safari 10.1 bug workaround, imports run once and are hoisted, circular imports work if top-level work is avoided, and you can bridge CommonJS via a support file plus Rollup commonjs plugin; dynamic import returns a Promise and needs a base path when polyfilled.
AI-written summary · about
chapters (8)
- 0:00Start
- 15:21Module execution
- 16:45Export vs side-effects
- 17:49Modules are deferred
- 19:18Modules, hoisted
- 23:24Option: rollup commonJS
- 30:02Source Graph
- 30:43Import function
related talks
47mNative JavaScript Modules: import {Browsers, Node.js}; export {production};
31mECMAScript Modules: Past, Present, and Future
46mES Modules: The next revolution?
48mESM: EcmaScript Modules in browser and NodeJS. It's about time!
05mAuthoring and publishing ES6 modules today
52mA taste of EcmaScript 6: the language and the tools
43mWhat’s new in ES6 for Web Devs
34mNode.js: Path to ES6 modules