{"action":"created","issue":{"url":"https://api.github.com/repos/angular/angular-cli/issues/13287","repository_url":"https://api.github.com/repos/angular/angular-cli","labels_url":"https://api.github.com/repos/angular/angular-cli/issues/13287/labels{/name}","comments_url":"https://api.github.com/repos/angular/angular-cli/issues/13287/comments","events_url":"https://api.github.com/repos/angular/angular-cli/issues/13287/events","html_url":"https://github.com/angular/angular-cli/issues/13287","id":393727556,"node_id":"MDU6SXNzdWUzOTM3Mjc1NTY=","number":13287,"title":"main.js size affected by import in lazy module","user":{"login":"yaitskov","id":1292734,"node_id":"MDQ6VXNlcjEyOTI3MzQ=","avatar_url":"https://avatars0.githubusercontent.com/u/1292734?v=4","gravatar_id":"","url":"https://api.github.com/users/yaitskov","html_url":"https://github.com/yaitskov","followers_url":"https://api.github.com/users/yaitskov/followers","following_url":"https://api.github.com/users/yaitskov/following{/other_user}","gists_url":"https://api.github.com/users/yaitskov/gists{/gist_id}","starred_url":"https://api.github.com/users/yaitskov/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/yaitskov/subscriptions","organizations_url":"https://api.github.com/users/yaitskov/orgs","repos_url":"https://api.github.com/users/yaitskov/repos","events_url":"https://api.github.com/users/yaitskov/events{/privacy}","received_events_url":"https://api.github.com/users/yaitskov/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2018-12-23T06:33:00Z","updated_at":"2018-12-26T08:54:46Z","closed_at":"2018-12-26T08:54:46Z","author_association":"NONE","body":"main.js files is slowly growing if new modules added in a lazy module when project is build with --prod feature. Without prod main.js remains the same.\r\n\r\n\r\n### Bug Report or Feature Request (mark with an `x`)\r\n```\r\n- [x ] bug report -> please search issues before submitting\r\n- [ ] feature request\r\n```\r\n\r\n### Command (mark with an `x`)\r\n```\r\n- [ ] new\r\n- [ x] build\r\n- [ ] serve\r\n- [ ] test\r\n- [ ] e2e\r\n- [ ] generate\r\n- [ ] add\r\n- [ ] update\r\n- [ ] lint\r\n- [ ] xi18n\r\n- [ ] run\r\n- [ ] config\r\n- [ ] help\r\n- [ ] version\r\n- [ ] doc\r\n\r\n```\r\n\r\n### Versions\r\n```\r\nnode --version\r\nv10.14.2\r\n22:16$ npm --version\r\n6.5.0\r\n22:16$ ng --version     \r\nAngular CLI: 7.1.4\r\nNode: 10.14.2\r\nOS: linux x64\r\nAngular: 7.1.4\r\n... animations, cli, common, compiler, compiler-cli, core, forms\r\n... http, language-service, platform-browser\r\n... platform-browser-dynamic, router\r\n\r\nPackage                           Version\r\n-----------------------------------------------------------\r\n@angular-devkit/architect         0.11.4\r\n@angular-devkit/build-angular     0.11.4\r\n@angular-devkit/build-optimizer   0.11.4\r\n@angular-devkit/build-webpack     0.11.4\r\n@angular-devkit/core              7.1.4\r\n@angular-devkit/schematics        7.1.4\r\n@ngtools/webpack                  7.1.4\r\n@schematics/angular               7.1.4\r\n@schematics/update                0.11.4\r\nrxjs                              6.3.3\r\ntypescript                        3.1.6\r\nwebpack                           4.23.1\r\n\r\nlsb_release  -a\r\nNo LSB modules are available.\r\nDistributor ID:\tUbuntu\r\nDescription:\tUbuntu 17.10\r\nRelease:\t17.10\r\nCodename:\tartful\r\n\r\n```\r\n    \r\n\r\n\r\n### Repro steps\r\n\r\nng new app --routing\r\n\r\n```\r\nimport { NgModule } from '@angular/core';\r\nimport { Routes, RouterModule } from '@angular/router';\r\n\r\nconst routes: Routes = [\r\n    {\r\n        path: 'module-a',\r\n        loadChildren: './module-a/module-a.module#ModuleAModule'\r\n    },\r\n    {\r\n        path: 'module-b',\r\n        loadChildren: './module-b/module-b.module#ModuleBModule'\r\n    },\r\n    {\r\n        path: '',\r\n        redirectTo: '',\r\n        pathMatch: 'full'\r\n    }\r\n];\r\n\r\n@NgModule({\r\n  imports: [RouterModule.forRoot(routes)],\r\n  exports: [RouterModule]\r\n})\r\nexport class AppRoutingModule { }\r\n```\r\n\r\n2 modules lazy modules and one of the imports something\r\n\r\n```\r\nimport { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { FormsModule } from '@angular/forms';\r\n\r\nimport { NgbModule } from '@ng-bootstrap/ng-bootstrap';\r\nimport { AmazingTimePickerModule } from 'amazing-time-picker';\r\nimport { AngularFontAwesomeModule } from 'angular-font-awesome';\r\n\r\nimport { ModuleBRoutingModule } from './module-b-routing.module';\r\nimport { ComponentGlistComponent } from './component-glist/component-glist.component';\r\n\r\n@NgModule({\r\n    declarations: [ComponentGlistComponent],\r\n    imports: [\r\n        CommonModule,\r\n        FormsModule,\r\n        ModuleBRoutingModule,\r\n        AmazingTimePickerModule,\r\n        AngularFontAwesomeModule,\r\n        NgbModule\r\n    ]\r\n})\r\nexport class ModuleBModule { }\r\n\r\n```\r\n \r\n\r\n### The log given by the failure\r\nLook at size progess for prod builds: \r\n\r\norigin sizie\r\n```\r\n  -rw-rw-r-- 1 dan dan   1108 gru 22 20:40 5.2d738201223bf834d251.js\r\n  -rw-rw-r-- 1 dan dan 281315 gru 22 20:40 main.1e7a42998bc677470d9c.js\r\n```\r\nwith awesome time picker\r\n```\r\n  -rw-rw-r-- 1 dan dan 227767 gru 22 20:37 5.b1f022d4fa5721f64060.js\r\n  -rw-rw-r-- 1 dan dan 295078 gru 22 20:37 main.0ad51b8fbb6b59a7fa9a.js\r\n```\r\nwith ng bootstrap + awesome time picker \r\n```\r\n  -rw-rw-r-- 1 dan dan 593644 gru 22 22:03 5.af20dde0d5192ca0872b.js\r\n  -rw-rw-r-- 1 dan dan 309346 gru 22 22:03 main.aac5430a183d20963769.js\r\n```\r\n\r\nmean while main.js size is const for non prod build\r\n```\r\n  -rw-rw-r-- 1 dan dan   10031 gru 22 20:43 main.js\r\n  -rw-rw-r-- 1 dan dan 3518353 gru 22 20:42 vendor.js\r\n```\r\n\r\n\r\nI tried to diff minified fiels the different is not significant:\r\n```\r\n...\r\n-r.c(e,t),e.prototype._next=function(t){var\r\n+r.__extends(e,t),e.prototype._next=function(t){var\r\n...\r\n```\r\n\r\n I non minified size stays the same so I guess it is doable for minified."},"comment":{"url":"https://api.github.com/repos/angular/angular-cli/issues/comments/449932651","html_url":"https://github.com/angular/angular-cli/issues/13287#issuecomment-449932651","issue_url":"https://api.github.com/repos/angular/angular-cli/issues/13287","id":449932651,"node_id":"MDEyOklzc3VlQ29tbWVudDQ0OTkzMjY1MQ==","user":{"login":"alan-agius4","id":17563226,"node_id":"MDQ6VXNlcjE3NTYzMjI2","avatar_url":"https://avatars3.githubusercontent.com/u/17563226?v=4","gravatar_id":"","url":"https://api.github.com/users/alan-agius4","html_url":"https://github.com/alan-agius4","followers_url":"https://api.github.com/users/alan-agius4/followers","following_url":"https://api.github.com/users/alan-agius4/following{/other_user}","gists_url":"https://api.github.com/users/alan-agius4/gists{/gist_id}","starred_url":"https://api.github.com/users/alan-agius4/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/alan-agius4/subscriptions","organizations_url":"https://api.github.com/users/alan-agius4/orgs","repos_url":"https://api.github.com/users/alan-agius4/repos","events_url":"https://api.github.com/users/alan-agius4/events{/privacy}","received_events_url":"https://api.github.com/users/alan-agius4/received_events","type":"User","site_admin":false},"created_at":"2018-12-26T08:54:46Z","updated_at":"2018-12-26T08:54:46Z","author_association":"COLLABORATOR","body":"Hi, what you are seeing here is the result that each of the above packages require addition features from vendor packages that your application is not using directly. Thus when adding a dependency the vendor module will pull these dependencies inside the main bundle. For instance, `ngClass` (among others) is required by `amazing-time-picker`, Thus this is being pulled into in the `main.js` since by default on production builds we don't include vendor chunks. \r\n\r\nOn the other hand dev builds retain the same size, because there is no tree-shaking / dead code elimination, and thus all code is included in the bundle.\r\n\r\nIf you'd like to split your main and vendor, this of course can be add via `vendorChunk` option, which will create a seperate file for vendor packages."}}
{"actor":{"display_login":"alan-agius4"}}