Package resolve error with Vite

Antzy commented 3 months ago

When I try integrating this in a Vite React app, or any other builder except Create-React-App, I get the following error. All solutions I could find to fix this leads to altering package files in node_modules, which is obviously not ideal. Any help is appreciated.

X [ERROR] Failed to resolve entry for package "react-use-face-detection". The package may have incorrect main/module/exports specified in its package.json. [plugin vite:dep-scan]

src/components/webcamCapture/WebcamCapture.tsx:3:48:
  3 │ ... CameraOptions, useFaceDetection } from "react-use-face-detection";
    ╵                                            ~~~~~~~~~~~~~~~~~~~~~~~~~~

at failureErrorWithLog (D:\apps\Tablet App React\tab-app-react-vite\node_modules\esbuild\lib\main.js:1651:15)
at D:\apps\Tablet App React\tab-app-react-vite\node_modules\esbuild\lib\main.js:1059:25
at runOnEndCallbacks (D:\apps\Tablet App React\tab-app-react-vite\node_modules\esbuild\lib\main.js:1486:45)
at buildResponseToResult (D:\apps\Tablet App React\tab-app-react-vite\node_modules\esbuild\lib\main.js:1057:7)
at D:\apps\Tablet App React\tab-app-react-vite\node_modules\esbuild\lib\main.js:1069:9
at new Promise (<anonymous>)
at requestCallbacks.on-end (D:\apps\Tablet App React\tab-app-react-vite\node_modules\esbuild\lib\main.js:1068:54)
at handleRequest (D:\apps\Tablet App React\tab-app-react-vite\node_modules\esbuild\lib\main.js:732:17)
at handleIncomingPacket (D:\apps\Tablet App React\tab-app-react-vite\node_modules\esbuild\lib\main.js:757:7)
at Socket.readFromStdout (D:\apps\Tablet App React\tab-app-react-vite\node_modules\esbuild\lib\main.js:680:7)

pandaling commented 2 months ago

I found this and it works for me.

export default defineConfig({
  plugins: [react()],
  resolve: {
    alias: {
      // Use aliases
      'react-use-face-detection': '/node_modules/react-use-face-detection/build/index.js',
    },
  }
})

Antzy commented 2 months ago

I found this and it works for me.

export default defineConfig({
  plugins: [react()],
  resolve: {
    alias: {
      // Use aliases
      'react-use-face-detection': '/node_modules/react-use-face-detection/build/index.js',
    },
  }
})

Thank you! This worked for me.

lauirvin / react-use-face-detection

Package resolve error with Vite #6