pmndrs / use-gesture

👇Bread n butter utility for component-tied mouse/touch gestures in React and Vanilla Javascript.

Home Page:https://use-gesture.netlify.app

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

node16 moduleResolution resolves to CJS build instead of ESM

cseas opened this issue · comments

Describe the bug

@use-gesture packages ship with a dual package build. The expectation is that an ESM project should resolve to the ESM build shipped by the package. But it is resolving to the CJS build.

Screenshot 2023-02-27 at 10 29 03 AM

Screenshot 2023-02-27 at 10 31 36 AM

Possible fix can be to either add a package.json with "type": "module" to the esm build directory. Or rename the esm build files to .mjs file extension.

Sandbox or Video

Refer: https://arethetypeswrong.github.io/

Information:

  • Use Gesture version: v10.2.24
  • Device: NA
  • OS: NA
  • Browser: NA

Checklist:

  • I've read the documentation.
  • If this is an issue with drag, I've tried setting touch-action: none to the draggable element.

The expectation is that an ESM project should resolve to the ESM build shipped by the package. But it is resolving to the CJS build.

Why this is an expectation? :) If you are loading this through node you will end up with a CJS build. You can still require/import it. When you bundle things then most of the modern bundlers should pick up the file defined by the module condition and that is written in ESM.

I got a bit confused by the output of https://arethetypeswrong.github.io/
Opened arethetypeswrong/arethetypeswrong.github.io#9 for clarity.

I just saw that the package only has one types file use-gesture-core.cjs.d.ts that is used even for ESM imports. Got confused by the cjs part in the filename, but looks like it is working as intended.