Reasons why we should alias lodash-es to lodash

[kwhsiung]

Thanks for curating these useful tips. 😃 But I have question about "Alias lodash-es to lodash"

Some of your dependencies might use the lodash-es package instead of lodash. If that’s the case, Lodash will be bundled twice.

I just wondering the scenario that "Lodash will be bundled twice".

1. Is the scenario that we import both lodash and lodash-es packages in some of our js files. So we should alias lodash-es to lodash, to prevent webpack bundling both lodash-es and lodash?
2. If 1. is true, why we are not alias lodash to lodash-es but alias lodash-es to lodash, Is the consideration is about lodash-fp? Because the bundle size that lodash-fp + lodash-es > lodash-fp + lodash.

[iamakulov]

Is the scenario that we import both lodash and lodash-es packages in some of our js files. So we should alias lodash-es to lodash, to prevent webpack bundling both lodash-es and lodash?

Yup! Specifically, the scenario is “I’m using lodash but my dependency a is using lodash-es”. Or vice versa.

If 1. is true, why we are not alias lodash to lodash-es but alias lodash-es to lodash, Is the consideration is about lodash-fp? Because the bundle size that lodash-fp + lodash-es > lodash-fp + lodash.

Hmm, that’s a good question. I think some configurations had compatibility issues when aliasing lodash to lodash-es, but I can’t really remember. (Never knew about the bundle size aspect of lodash/fp though.) I’ll add more info if I find anything!

[privatenumber]

RE: why not alias lodash to lodash-es

I conducted a quick investigation here, and I've found that using lodash-es is the least performant if using WP4 (fine in WP5).

Experiment	Output size (kB)
Tree-shaking w/ babel-plugin-lodash & lodash-webpack-plugin	19.7
Tree-shaking w/ lodash-es	120.8
Tree-shaking w/ babel-plugin-lodash	121.2
Importing specific lodash utils by path (Baseline)	121.5
Tree-shaking w/ lodash-es using WP4	135.5