lodash tree shaking 이슈 - Githubissues

JaeYeopHan / tip-archive

📦 Archiving various development tips. If you watch this repository, you can get issues related to the newly registered development tip from the GitHub feed.

https://www.facebook.com/Jbee.dev/

245 stars 8 forks source link

lodash tree shaking 이슈 #34

Open JaeYeopHan opened 5 years ago

JaeYeopHan commented 5 years ago

Description

그냥 lodash (lodash@4.17.11)는 commonjs로 번들링되서 npm에 배포되었기 때문에 tree shaking이 적용되지 않음.
esm 형태로 배포된 lodash-es를 사용해야 함.

현재 lodash API 중 사용하고 있는 것은...

partial
get
merge
toInteger
concat
find
isEmpty
reduce
isEmpty
last
size
isUndefined
upperFirst
camelCase
debounce
noop
isString
toNumber
includes

...

Reports

Tree shaking이 적용되지 않은 lodash build 결과 (bundle size: 201.86kb)

no-treeshaking

Tree shaking이 적용된 lodash-es build 결과 (bundle size: 112.91kb)

tree-shaking

Conclusion

lodash-es 를 쓰자!

$ npm i -S lodash-es

JaeYeopHan commented 5 years ago

이미 lodash를 여러 군데에서 사용한 프로젝트에서는 어떻게 하면 좋을까? 싹 다 바꿀 수도 없는 노릇이다.

@KrComet님이 알려주신 babel-plugin-lodash를 사용하자.

changyoungoh commented 3 years ago

:+1: