Skip to content

Analyzing bundles with source-map-explorer doens't work #6715

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.

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

Closed
carpben opened this issue Mar 25, 2019 · 13 comments
Closed

Analyzing bundles with source-map-explorer doens't work #6715

carpben opened this issue Mar 25, 2019 · 13 comments

Comments

@carpben
Copy link
Contributor

carpben commented Mar 25, 2019

Is this a bug report?

yes

Did you try recovering your dependencies?

yes

Which terms did you search for in User Guide?

analyze

Environment

Environment Info:
System:
OS: Windows 10
CPU: x64 Intel(R) Core(TM) i7-8550U CPU @ 1.80GHz
Binaries:
Yarn: 1.9.2 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
npm: 6.9.0 - C:\Program Files\nodejs\npm.CMD
Browsers:
Edge: 42.17134.1.0
Internet Explorer: 11.0.17134.1
npmPackages:
react: ^16.7.0 => 16.8.5
react-dom: ^16.7.0 => 16.8.5
react-scripts: ^2.1.5 => 2.1.8
npmGlobalPackages:
create-react-app: Not Found

Steps to Reproduce

  1. create a typescript CRA project
  2. create components.
  3. Divide them to various apps/sub projects.
  4. Render apps conditionally, using React.lazy and Suspense
  5. Follow instructions on https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size
    a. npm install --save source-map-explorer
    b. add "analyze": "source-map-explorer 'build/static/js/*.js'" to scripts.
    c. run "npm run build" followed by "npm run analyse".

Actual Behavior

Error: No file(s) found
image

@bugzpodder
Copy link

Can you try npx source-map-explorer 'build/static/js/*.js'
It seems you have everything setup correctly. Lazy loaded modules still creates a file in a separate bundle and I have tried it on my setup with no problems.
It's either a windows issue, or that you are running an older version that you did not install (seems to be the latest from your package.json).
Either wise I'd need a repo to try it out further.

@carpben
Copy link
Contributor Author

carpben commented Mar 26, 2019

npx source-map-explorer 'build/static/js/*.js' works. Thanks!

How can we solve this for others? Perhaps remove the script altogether, and suggest npx source-map-explorer 'build/static/js/*.js' instead?

@bugzpodder
Copy link

bugzpodder commented Mar 26, 2019

I'm glad it worked out. I am not sure why it didn't work in the first place with npm scripts, if you get a chance can you do a npm cache clean and npm analyse again to see if that would fix things with the npm script?

@carpben
Copy link
Contributor Author

carpben commented Mar 27, 2019

@bugzpodder, sure. Here is a copy paste from my PowerShell:

PS C:\Users\carpb\projects\gw\gw-ts> npm cache cleannpm ERR! As of npm@5, the npm cache self-heals from corruption issues and data extracted from the cache is guaranteed to be valid. If you want to make sure everything is consistent,
use 'npm cache verify' instead. On the other hand, if you're debugging an issue with the installer, you can use `npm install --cache /tmp/empty-cache` to use a temporary cache instead of nuking the actual one.npm ERR!
npm ERR! If you're sure you want to delete the entire cache, rerun this command with --force.npm ERR! A complete log of this run can be found in:npm ERR!     C:\Users\carpb\AppData\Roaming\npm-cache\_logs\2019-03-27T09_00_06_229Z-debug.log

followed by:

PS C:\Users\carpb\projects\gw\gw-ts> npm cache verify
Cache verified and compressed (~\AppData\Roaming\npm-cache\_cacache):
Content verified: 5828 (247906215 bytes)
Content garbage-collected: 2194 (104110440 bytes)
Index entries: 10292
Finished in 39.124s

@tirli
Copy link

tirli commented Apr 17, 2019

I have the same error. Also Win10. It works via npx source-map-explorer and via node_mobiles/.bin/source-map-explorer from console. But doesn't work both with npm run analyze and yarn analyze

yarn cache clean doesn't help

@migodev42
Copy link

Same problem solved by npx source-map-explorer 'build/static/js/*.js'.

@mistereechapman
Copy link

If the documentation is updated to remove the single quotes from the path then this will work.

@mistereechapman
Copy link

For any windows users running into the same issue try removing the quotes. Even when trying the npx workaround also I ran into the same issues until I removed the quotes.

node : V11.10.1
npm : 6.7.0

@iKlsR
Copy link

iKlsR commented Apr 24, 2019

@mistereechapman Thanks, the other way for me using git-bash. Using double quotes works. 🤷‍♂️

@yi-huan
Copy link

yi-huan commented May 17, 2019

Thanks, Using double quotes works.
批注 2019-05-17 155432

@guillermo
Copy link

After researching this seems to work:

$ npm run build -- --stats
$ npx webpack-bundle-analyzer ./build/bundle-stats.json 

Found here: https://medium.com/@jbandi/you-can-use-create-react-app-with-webpack-bundle-analyzer-without-ejecting-1b8727d9b2ea

@S3gillu
Copy link

S3gillu commented May 21, 2019

If the documentation is updated to remove the single quotes from the path then this will work.

This is the perfect workaround as per now

@bugzpodder
Copy link

Source map explorer 2.0 is out and quotes should now be fixed.

@lock lock bot locked and limited conversation to collaborators Jun 21, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

9 participants