Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to build bundle-stats.json in create react app?

I need to build bundle-stats.json to work with webpack-bundle-analyzer. Here how i'm trying build it , but it does not creating any file.

npm run build -- --stats

Could you please help me

like image 283
Yerlan Yeszhanov Avatar asked Sep 26 '19 08:09

Yerlan Yeszhanov


People also ask

How do I create a bundle in react app?

Run npm run build or npx react-scripts build to create an optimized production build for your React App and then run the command npx gulp to bundle all the JS and CSS files in the static build folder into the single main html file.

Can I add webpack config to create react app?

Create React App (CRA) ships with webpack already under the hood, but usually, we would need to add more configurations as our app grows. Luckily for us, we can create a webpack. config. js file and put our webpack configurations in there.

How do you analyze bundle size react?

Using webpack-bundle-analyzer From top to bottom - we can see the name of the bundle (which will match what you see in the network tab), and then the node_modules folder. Inside of that you can see that react-dom takes up the majority of the bundle size and then react takes up a much smaller amount on the right.


2 Answers

The --stats flag was added back into CRA in this PR.

So you can use webpack-bundle-analyzer again.

like image 108
David Villamizar Avatar answered Oct 25 '22 00:10

David Villamizar


stats have been remove from CRA see

It's recommended to use source-map-explorer

npm i -g source-map-explorer
source-map-explorer 'build/static/js/*.js'.
like image 41
flagboy firelight Avatar answered Oct 25 '22 01:10

flagboy firelight