Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

webpack-bundle-analyzer errors out on differential build - no such file #15915

Closed
SanderElias opened this issue Oct 22, 2019 · 5 comments · Fixed by #16181
Closed

webpack-bundle-analyzer errors out on differential build - no such file #15915

SanderElias opened this issue Oct 22, 2019 · 5 comments · Fixed by #16181
Labels
area: @angular-devkit/build-angular freq2: medium severity5: regression type: bug/fix
Milestone
v9-blockers

Comments

@SanderElias
Copy link

🐞 Bug report

As I wanted to analyze my bundles I added webpack-bundle-analyzer to my project.
Then I used the command

ng build --prod --statsJson && webpack-bundle-analyzer ./dist/app/stats-es2015.json

result:
image

This happened in mutliple of my projects. The common demoninator seems to be diffential loading. As soon as that is turned on, I get this error.
@SanderElias SanderElias changed the title Webpack-bundlu-analyzer errors out on differntial build webpack-bundle-analyzer errors out on differential build Oct 22, 2019
@ngbot ngbot bot modified the milestone: needsTriage Oct 22, 2019
@alan-agius4 alan-agius4 changed the title webpack-bundle-analyzer errors out on differential build webpack-bundle-analyzer errors out on differential build - no such file Oct 22, 2019
@ngbot ngbot bot modified the milestones: needsTriage, Backlog Oct 22, 2019
@SanderElias
Copy link
Author

For anyone that needs a workaround:

ng build --prod --source-map && npx source-map-explorer ./dist/app/*-es2015.*.js

uses a different tool that also analyzes your bundles.

@trotyl trotyl mentioned this issue Oct 27, 2019
Closed
@vikerman vikerman modified the milestones: Backlog, 9.0.x Oct 31, 2019
@IgorMinar IgorMinar modified the milestones: v9-candidates, v9-blockers Nov 12, 2019
@dgp1130
Copy link
Collaborator

dgp1130 commented Nov 12, 2019 •
edited by clydin
Loading

Seems that this one file gets renamed after the Webpack stats are generated. Future rearchitecting should fix problems like this in the longer term. For v9, we can just rename this one file, which should resolve the issue for the time being.

https://github.com/angular/angular-cli/blob/master/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/common.ts#L287

dgp1130 added a commit to dgp1130/angular-cli that referenced this issue Nov 12, 2019
@dgp1130
fix(@angular-devkit/build-webpack): rewrite ES5 polyfills file name (a…
f3df3b1 
…ngular#15915)

The name is incorrect because the file is renamed after generation by Webpack, so the stats file contains a broken link. This hacks together a quick rewrite to the asset list to use the new filename.
dgp1130 added a commit to dgp1130/angular-cli that referenced this issue Nov 12, 2019
@dgp1130
fix(@angular-devkit/build-webpack): rewrite ES5 polyfills file name (a…
4246dca 
…ngular#15915)

The name is incorrect because the file is renamed after generation by Webpack, so the stats file contains a broken link. This hacks together a quick rewrite to the asset list to use the new filename.
dgp1130 added a commit to dgp1130/angular-cli that referenced this issue Nov 12, 2019
@dgp1130
fix(@angular-devkit/build-webpack): rewrite ES5 polyfills file name (a…
d43e1a4 
…ngular#15915)

The name is incorrect because the file is renamed after generation by Webpack, so the stats file contains a broken link. This hacks together a quick rewrite to the asset list to use the new filename.
@dgp1130
Copy link
Collaborator

dgp1130 commented Nov 12, 2019

Sent out #16169 with a hack to fix this in the short term.

clydin added a commit to clydin/angular-cli that referenced this issue Nov 13, 2019
@clydin
fix(@angular-devkit/build-angular): prevent webpack from adding suffi…
e43bf51 
…xes to polyfills files

The ES5 polyfills file was erroneously being suffixed with `es2015`.  The webpack configuration does not support conditional customization per chunk for the output filenames (`chunkFilename` option schema only supports string values).  This change adds an additional small webpack plugin that allows the chunk filenames to be adjusted based on the chunk name.  The plugin is only added when differential loading is enabled as this is the only time that a chunk currently requires its filename to be adjusted.

Closes angular#15915
clydin added a commit to clydin/angular-cli that referenced this issue Nov 13, 2019
@clydin
fix(@angular-devkit/build-angular): prevent webpack from adding suffi…
5325f97 
…xes to polyfills files

The ES5 polyfills file was erroneously being suffixed with `es2015`.  The webpack configuration does not support conditional customization per chunk for the output filenames (`chunkFilename` option schema only supports string values).  This change adds an additional small webpack plugin that allows the chunk filenames to be adjusted based on the chunk name.  The plugin is only added when differential loading is enabled as this is the only time that a chunk currently requires its filename to be adjusted.

Closes angular#15915
@clydin clydin mentioned this issue Nov 13, 2019
Merged
clydin added a commit to clydin/angular-cli that referenced this issue Nov 13, 2019
@clydin
fix(@angular-devkit/build-angular): prevent webpack from adding suffi…
f76fed6 
…xes to polyfills files

The ES5 polyfills file was erroneously being suffixed with `es2015`.  The webpack configuration does not support conditional customization per chunk for the output filenames (`chunkFilename` option schema only supports string values).  This change adds an additional small webpack plugin that allows the chunk filenames to be adjusted based on the chunk name.  The plugin is only added when differential loading is enabled as this is the only time that a chunk currently requires its filename to be adjusted.

Closes angular#15915
clydin added a commit to clydin/angular-cli that referenced this issue Nov 13, 2019
@clydin
fix(@angular-devkit/build-angular): prevent webpack from adding suffi…
30756f0 
…xes to polyfills files

The ES5 polyfills file was erroneously being suffixed with `es2015`.  The webpack configuration does not support conditional customization per chunk for the output filenames (`chunkFilename` option schema only supports string values).  This change adds an additional small webpack plugin that allows the chunk filenames to be adjusted based on the chunk name.  The plugin is only added when differential loading is enabled as this is the only time that a chunk currently requires its filename to be adjusted.

Closes angular#15915
@dgp1130
Copy link
Collaborator

dgp1130 commented Nov 14, 2019

I closed PR #16169 in favor of a better idea @clydin had in #16181. Passing this issue to him.

@dgp1130 dgp1130 removed their assignment Nov 14, 2019
dgp1130 pushed a commit that referenced this issue Nov 18, 2019
@clydin @dgp1130
fix(@angular-devkit/build-angular): prevent webpack from adding suffi…
d8438f7 
…xes to polyfills files

The ES5 polyfills file was erroneously being suffixed with `es2015`.  The webpack configuration does not support conditional customization per chunk for the output filenames (`chunkFilename` option schema only supports string values).  This change adds an additional small webpack plugin that allows the chunk filenames to be adjusted based on the chunk name.  The plugin is only added when differential loading is enabled as this is the only time that a chunk currently requires its filename to be adjusted.

Closes #15915
dgp1130 pushed a commit that referenced this issue Nov 18, 2019
@clydin @dgp1130
fix(@angular-devkit/build-angular): prevent webpack from adding suffi…
c78c81a 
…xes to polyfills files

The ES5 polyfills file was erroneously being suffixed with `es2015`.  The webpack configuration does not support conditional customization per chunk for the output filenames (`chunkFilename` option schema only supports string values).  This change adds an additional small webpack plugin that allows the chunk filenames to be adjusted based on the chunk name.  The plugin is only added when differential loading is enabled as this is the only time that a chunk currently requires its filename to be adjusted.

Closes #15915

(cherry picked from commit d8438f7)
@angular-automatic-lock-bot
Copy link

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.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Dec 19, 2019
@clydin clydin removed their assignment Jun 28, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
area: @angular-devkit/build-angular freq2: medium severity5: regression type: bug/fix
Projects
None yet
Milestone
v9-blockers
6 participants
@vikerman @IgorMinar @SanderElias @dgp1130 @alan-agius4 @clydin