How to use tree-shaking with webpack 2 and typescript and angular 2?

Question

I have set up webpack 2 with angular and mostly it seems to work. It does not seem though that it does the tree-shaking, since I have an app that does almost nothing, and the vendor.js is still 800+ KB.

It seems there is very little information available on how to turn the tree-shaking on, but what I understood that it's automatically turned on for ES6 modules, but does not work for ES5. Is that so?

And most importantly: How can I apply tree-shaking to typescript/angular2 with webpack2?

Answer 1

I have found this very nice repository with examples on how to do this.

As mentioned in there and in the comments to the question, there are apparently bugs that prevent the tree-shaking from happening. That seems to mean it's not really possible to do now with "target": "es5".

We can use es2015, but then we'll need some additional steps (e.g. via Babel) to compile to es5 until browsers support it.