Tree-shaking with webpack 2 and Babel 6
Rich Harris’ module bundler Rollup popularized an important feature in the JavaScript world: tree-shaking , excluding unused exports from bundles. Rollup depends on the static structure of ES6 modules (imports and exports can’t be changed at runtime) to detect which exports are unused. Tree-shaking for webpack is currently in beta. This blog post explains how it works. The project we are going to examine is on GitHub: tree-shaking-demo How webpack 2 eliminates unused exports webpack 2, a new version that is in beta, eliminates unused exports in two steps: First, all ES6 module files are combined into a single bundle file. In that file, exports that were not imported anywhere are not exported, anymore. Second, the bundle is minified, while eliminating dead code. Therefore, entities that are neither exported nor used inside their modules do not appear in the minified bundle. Without the first step, dead code elimination would never remove exports (registering an export keeps it alive)....