How to have @angular/core as small as 75kB in the bundle?
rxjs-space opened this issue · comments
Please provide us with the following information:
OS?
Windows 10.
Versions.
angular-cli: local (v1.0.0-beta.26, branch: beta26)
node: 6.5.0
os: win32 x64
@angular/common: 2.4.4
@angular/compiler: 2.4.4
@angular/core: 2.4.4
@angular/forms: 2.4.4
@angular/http: 2.4.4
@angular/platform-browser: 2.4.4
@angular/platform-browser-dynamic: 2.4.4
@angular/router: 3.4.4
@angular/compiler-cli: 2.4.4
Repro steps.
A) for angular-cli generated app:
A.1) ng new some-app
A.2) cd some-app && ng build --prod --aot --sm
(the sourcemap is for later steps)
A.3) npm i source-map-explorer -g
A.4) cd dist && source-map-explorer vendor.[hash].bundle.js
B) for toh:
B.1) git clone https://github.com/johnpapa/angular2-tour-of-heroes.git toh
B.2) cd toh
(add the missing bit as following)
B.3) edit tsconfig-aot.json
, insert "lib": [ "es2015", "dom" ],
after "target": "es5",
B.4) edit package.json
, insert "aot-gzip": "npm run aot && npm run rollup && gulp copy-aot-gzip"
after "start-aot": ...
B.5) npm run aot-gzip
B.6) cd dist && source-map-explorer build.js
The log given by the failure.
No error.
Mention any other details that might be useful.
After repro A), I have this breakdown, with @angular/core size at 135kB.
After repro B), the breakdown and @angular/core size at 72.3kB.
repro B is a full toh app while repor A is only hello-world, we may expect a larger @angular/core from repro B, but the result is the opposite. Obviously, repro B uses rollup. I'm not sure if that's the main reason for the size difference. I searched for ways to combine the benefits of webpack and rollup and found 'https://github.com/egoist/rollup-loader'. But I have no idea how to inject this into angular-cli. Is it possible to do something like loader: 'rollup-loader!webpackLoader'
? Thanks.
Thanks! We'll be in touch soon.
I think part of it is the webpack helpers, but also webpack/webpack#2899.
I haven't looked into the rollup-loader yet but it was on my list. Let me see what can be done.
@rxjs-space awesome breakdown. thanks for the details
I think this issue is related as well
Any news here
Please see #2901 for more information on this.
This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.
Read more about our automatic conversation locking policy.
This action has been performed automatically by a bot.