1

I am trying to import and use sharp in my Next.js project. I have tried uninstalling and reinstalling sharp many times but every time I run npm run dev, this is the error I get.

./node_modules/detect-libc/lib/detect-libc.js:3:0
Module not found: Can't resolve 'child_process'

Import trace for requested module:
./node_modules/sharp/lib/utility.js
./node_modules/sharp/lib/index.js
./pages/index.js

https://nextjs.org/docs/messages/module-not-found

For reference this is the code that is causing the error:

import sharp from "sharp";

I have also tried this code, with no success:

const sharp = require('sharp');

Every other dependency I have installed works except for sharp.

Arnav Thorat
  • 3,078
  • 3
  • 8
  • 33
cyrus
  • 11
  • 2
  • What version of node and sharp you are using?? – Soheb May 12 '22 at 16:44
  • 1
    did you import sharp in client side file? like in `pages/*.js` files ? – bogdanoff May 12 '22 at 16:48
  • Node v14.19.2, Sharp "0.30.4". I am fairly new to using JS but I think its because I am trying to use sharp in a function I built on the client side and it can only be used on the server side. If this is the case, where should I define the function I need to use? – cyrus May 12 '22 at 16:48
  • 1
    @bogdanoff Yea, I think that's the issue. I defined a function to process an image I pulled in from an api call. If I am unable to do this on the client side where should I do this? Sorry.. new to JS/ web dev – cyrus May 12 '22 at 16:50
  • If that's case the you may want to use dynamic imports, since you have not shared the client side code it is difficult to guide you. But here is the link for dynamic imports https://nextjs.org/docs/advanced-features/dynamic-import – Soheb May 12 '22 at 16:52
  • 1
    @cyrus so you want to process an image which is located somewhere else right ? then write an api in your backend for that. logic should be fetch that image (use axios or node-fetch) and it will return a buffer. Pass this buffer to `sharp` and process it & it will also return buffer now use this buffer to respond it to your client. NOTE: you cant use `sharp` package in client side in anyway. – bogdanoff May 12 '22 at 17:18

1 Answers1

0

There are issues specially if you use the M1 Macbook.

Read this comment below, or the others around: https://github.com/lovell/sharp/issues/2794#issuecomment-880363027

Gabesz Juhász
  • 167
  • 5