Remix dependency error

[mtaylor-tbpm]

I'm having an issue using the turntable in Remix. Works great running in dev mode but won't run as a production build because the package can't be located. All other dependencies work fine. Thought it might be ESM/CJS related but not sure. Any ideas? Thanks in advance.

Error: Cannot find package '/Users/michael/projects/tbpm-ui3/node_modules/react-image-turntable/package.json' imported from /Users/michael/projects/tbpm-ui3/build/server/index.js at legacyMainResolve (node:internal/modules/esm/resolve:215:26) at packageResolve (node:internal/modules/esm/resolve:841:14) at moduleResolve (node:internal/modules/esm/resolve:927:18) at defaultResolve (node:internal/modules/esm/resolve:1157:11) at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:390:12) at ModuleLoader.resolve (node:internal/modules/esm/loader:359:25) at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:234:38) at ModuleWrap. (node:internal/modules/esm/module_job:87:39) at link (node:internal/modules/esm/module_job:86:36)

[nerdyman]

Hey @mtaylor-tbpm, can you share snippet of how you're using the lib? I'm not sure why it would be complaining about the package.json being missing 🤔

Edit: It works OK on Stackblitz https://stackblitz.com/edit/remix-run-remix-8jkj74?file=app%2Froutes%2F_index.tsx

[mtaylor-tbpm]

image-turntable-test.zip

Sure, see attached. I created a simple app, similar to what you posted on Stackblitz. It runs fine under npm run dev. Try npm run build, then npm run start and you'll see the error. The path referenced in the error is valid

[nerdyman]

Thanks for the repro! I'll take a look.

[nerdyman]

---

This looks to have been resolved with the v4 release. The API has changed, you now pass the images to the useReactImageTurntable hook, then spread the variable onto slider.

E.g.

const Example = () => {
  const reactImageTurntable = useReactImageTurnable({ images });
  return <ReactImageTurnable {...reactImageTurntable} />;
}

The official v4 release hasn't been published yet, you can get the pre-release like so:

npm install react-image-turntable@next
pnpm install react-image-turntable@next
yarn add react-image-turntable@next

https://stackblitz.com/edit/remix-run-remix-yebr5qag?file=app%2Froutes%2F_index.tsx%3AL54