Webpack with react and lodash makes bundle.js more than 800kb

5 thoughts on “Webpack with react and lodash makes bundle.js more than 800kb”

1. Another idea would be to explicitly require the bits you want from lodash:

   const _each = require('lodash-node/modern/collections/forEach');

   Also you can make react much smaller by doing a production build:

   new webpack.DefinePlugin({
       'process.env': {
         // This has effect on the react lib size
         'NODE_ENV': JSON.stringify('production'),
       },
     })

2. For React, it’s a good idea to use React NPM module and have

           new webpack.DefinePlugin({
             'process.env': {
               'NODE_ENV': JSON.stringify('production')
             }
           })

   in plugins in production config.

   (Edit: nevermind, I just noticed @nelix already said that)

3. @gaearon a quick question: is the JSON.stringify really needed for 'NODE_ENV': JSON.stringify('production') ??

4. @binarykitchen

   You want the quotes to be there.
   i.e. it should be

   'NODE_ENV': '"production"'
   

   and not

   'NODE_ENV': 'production'
   

   or it’ll refer to undefined production variable.

   JSON.stringify it just to make it clear.

5. Use -p key (shortcut for --optimize-minimize):

   webpack -p --progress

Comments are closed.