3

When I try to use lodash function as a specific import as shown below then it shows to be it loads only 14.7KB in size. enter image description here

But when I try to use the import as a destructured object then it shows 69.6KB in size enter image description here

Some articles say it works the same for both the above imports while some say it doesn't. Just wanted to understand does it add the complete build or only a specific function in the final build, especially the 2nd syntax (destructuring)

Varun Sukheja
  • 6,170
  • 5
  • 51
  • 93

1 Answers1

1
$ npm i -D babel-plugin-lodash

.babelrc
{
  ...,
  "plugins": [..., "lodash"]
}

This will allow for any import style (e.g. import _ from 'lodash', import { isEqual } from 'lodash' as the plugin will transform each usage of a lodash func to: import xyz from 'lodash/xyz';

ramzeek
  • 2,226
  • 12
  • 23
Dave K
  • 11
  • 2
  • I still see the whole lib is getting bundled, even though I added this plugin to babel.config.js file as `const plugins = ['istanbul','lodash'];` – Varun Sukheja Oct 28 '21 at 19:27