🚀 webpack 2 and beyond 🚀

The road ahead

Today we’ve published webpack 2 to npm under the latest tag on npm! You can install it in your project using npm install webpack.

👀 Why Update? 👀

The upgrade from webpack 1 to 2 comes with some very exciting features.

🙅 ES6 Support 🙅‍

You no longer have to use babel to transpile import and export statements in your code. webpack now supports parsing of these statements. This allows us to leverage a new webpack 2 feature: “Tree shaking”!!

Tip: If you are using Babel to convert import and export statements to require statements, you can now turn this off with modifying using the preset options. We recommend the env preset to handle this for you.

["env", {"modules": false}]

See more about this in Babel’s documentation!

🌳 Tree shaking 🌳

Because ES6 import and export are statically analyzed, webpack can “mark” unused imports and allow minifiers such as UglifyJs, and Closure Compiler to remove the unused code. This may result in much smaller bundles! (Known as dead code elimination) – Click here for more info!

🏭 module.loaders => module.rules 🏭

We have made significant improvements in flexibility and configuration for loaders. This includes being able to pass functions into the `options` property, a new filter known as issuer, and also the ability to constrain the webpack parser on a per-loader basis to decrease build times, and enforce module consistency. Click here for more info!

🏎 Performance Budgets 🏎

We joined forces with Addy Osmani to create Performance budgets. Now by default, webpack will highlight bundles that exceed 250kb in size. You can read in detail how and why we love this feature. Click here for more info!

🎂 And so much more 🎁

This is just some of the top features. We’ve also improve our resolver, build speeds, loader API, support for the new whatwg loader spec to lazy load bundles using import(), and so much more!! Take a look at our migration guide to see all the changes!

🛣 The Road Ahead 🛣

There are so many exciting things happening that we’d like to share with you. First is our current and future milestones that we are planning.

🐛🗡 The Bugfix Release 🐛🗡

As of our final release, we are in the webpack 2.3 Bugfix Milestone. We will fix any critical issues that have been reported from the community updating to webpack 2. We ask that when you submit issues, remember to provide a reproducible example so that we can expedite the fixing process. After this milestone is finished we will publish those fixes for you and move on to our Feature Releases.

💅 The Feature Releases 💅

The feature milestones represent the enhancements that you have chosen! Since we published our Vote page, the battle between adding Rollup-style scope hoisting and better tree shaking support for TypeScript has been neck and neck. Once we’ve shipped our bugfix release, we will take the feature with the most votes and assign it to our 2.4 milestone and start development on it.

💍 And much more!!! 💍

We have lot’s of exciting things down the pipeline but we don’t want to spoil it all for you!!! Stay tuned for more updates.

No time to help contribute? Want to give back in other ways? Become a Backer or Sponsor to webpack by donating to our open collective. Open Collective not only helps support the Core Team, but also supports contributors who have spent significant time improving our organization on their free time! ❤