Can't shake Popper

[adi-works]

trafficstars

I consume react-popper-tooltip which is built on top of this package, and my simple CRA app can't shake it. I started an issue with the author here: https://github.com/mohsinulhaq/react-popper-tooltip/issues/97 and after looking at the code, we realized it can be an issue with react-popper, hence this issue. With Popper being shake-able, I don't see why tree-shaking shouldn't work.

Repro: https://github.com/adi518/react-popper-tooltip-treeshake-reproduction

Versions used by react-popper-tooltip:

• Popper.js: ^2.4.4
• react-popper: ^2.2.3

[mohsinulhaq]

to add to this, https://github.com/popperjs/react-popper/blob/master/src/usePopper.js#L7, here we are importing the whole package, while https://popper.js.org/docs/v2/tree-shaking/#popper-lite recommends that we should use popper-lite import to enable tree-shaking

[FezVrasta]

Have you tried to define your own createPopper option? That should allow the built in import to be tree shaked

[mohsinulhaq]

@FezVrasta do you mean I should recreate react-popper? Because that's all I use in the library.

[FezVrasta]

No, react-popper has a configuration option to pass your own "createPopper" function

[mohsinulhaq]

@FezVrasta my lib is built on top of the render-prop API, which doesn't seem to support it: https://github.com/popperjs/react-popper/blob/master/src/Popper.js#L69 Is there any way to use the "lite" createPopper with render props.

[adi-works]

@FezVrasta ? @mohsinulhaq Any progress on this guys? seems like an easy fix.

[FezVrasta]

Feel free to send a PR, unfortunately I don't have time to allocate to this now.

[adi-works]

I think we can submit a PR that changes the import of createPopper, unless you mean for a different kinda of fix.

[FezVrasta]

That would mean all the consumers would need to manually import the required modifiers, that'd be less than ideal

[adi-works]

Ah, so that means adding createPopper support to render props.

[FezVrasta]

Yes I think that'd work, but I'm not 100% sure tree shaking is working properly with this system either... I never tested it

[mohsinulhaq]

@FezVrasta I just tried using the "lite" popper import (import { createPopper } from '@popperjs/core/lib/popper-lite') for usePopper hook. But it looks like tree-shaking still doesn't work. Here's the reproduction repo: https://github.com/mohsinulhaq/react-popper-tooltip-treeshake-reproduction.

Am I doing this wrongly?