fs.opensync is not a function

Question

fs.opensync is not a function

tjnk24 opened this issue 4 years ago · comments

Hi, I'm trying to use this module in a react app, and when I'm trying to get dimensions of a .jpg image, the app is crashing with an error:

tried to remove "node_modules" folder and reinstall it again - this didn't help

Jay Collett · Answer 1 · Fri Mar 12 2021 20:52:11 GMT+0800 (China Standard Time)

What was the outcome from this ticket?

Damián Ponce · Answer 2 · Sun Mar 14 2021 09:02:25 GMT+0800 (China Standard Time)

I'm facing the same issue on Next.js.
It only gives TypeError: fs.openSync is not a function when called outside of getStaticProps (an async function that runs at buildtime). Inside it, it works no problem.

Phu Luyen · Answer 3 · Mon Nov 15 2021 14:56:52 GMT+0800 (China Standard Time)

I'm facing the same issue on Next.js. It only gives TypeError: fs.openSync is not a function when called outside of getStaticProps (an async function that runs at buildtime). Inside it, it works no problem.

Hi, did you manage to resolve this issue?

Damián Ponce · Answer 4 · Mon Nov 15 2021 15:17:05 GMT+0800 (China Standard Time)

I'm facing the same issue on Next.js. It only gives TypeError: fs.openSync is not a function when called outside of getStaticProps (an async function that runs at buildtime). Inside it, it works no problem.

Hi, did you manage to resolve this issue?

I'm pretty sure I did, but it was a while ago now, plus I was just starting to get a grip of GitHub issues and how to help with these kind of errors. So there's no way for me to go back and check the exact scenario. Sorry!

कारतोफ्फेलस्क्रिप्ट™ · Answer 5 · Mon Nov 15 2021 20:05:42 GMT+0800 (China Standard Time)

This module only works on nodejs, and not in the browser.
Handling this in React would vary from codebase to codebase.

But to support it in Next.js, it would make sense to put all calls to this module behind a if (typeof window === 'undefined) check, as suggested often on Next.js repo (for example here).

Phu Luyen · Answer 6 · Mon Nov 15 2021 20:10:33 GMT+0800 (China Standard Time)

This module only works on nodejs, and not in the browser. Handling this in React would vary from codebase to codebase.

But to support it in Next.js, it would make sense to put all calls to this module behind a if (typeof window === 'undefined) check, as suggested often on Next.js repo (for example here).

I'm manage to get rid of it by setting disableFS, but quick question, I cant use sizeOf from Reader.asDataURL but I can from Reader.AsArrayBuffer. Do u know why? Ty.

कारतोफ्फेलस्क्रिप्ट™ · Answer 7 · Mon Nov 15 2021 20:29:09 GMT+0800 (China Standard Time)

I'm manage to get rid of it by setting disableFS, but quick question, I cant use sizeOf from Reader.asDataURL but I can from Reader.AsArrayBuffer. Do u know why? Ty.

I assume this is because FileReader.readAsDataURL() gives you a base64 encoded string, which is yet another input format not supported by this module. This module was designed around the Buffer interface.
So, FileReader.readAsArrayBuffer() or Blob.arrayBuffer(), which return an ArrayBuffer might work.

I say "might" because I have never personally tested this, as I've only worked to support nodejs. I don't even know if any of it works in deno, or any other JS/TS environments.

regarding disableFS: just to make sure that you are aware, this will disable support for TIFFs completely. other image formats will work as expected.

Phu Luyen · Answer 8 · Mon Nov 15 2021 20:35:03 GMT+0800 (China Standard Time)

I'm manage to get rid of it by setting disableFS, but quick question, I cant use sizeOf from Reader.asDataURL but I can from Reader.AsArrayBuffer. Do u know why? Ty.

I assume this is because FileReader.readAsDataURL() gives you a base64 encoded string, which is yet another input format not supported by this module. This module was designed around the Buffer interface. So, FileReader.readAsArrayBuffer() or Blob.arrayBuffer(), which return an ArrayBuffer might work.

I say "might" because I have never personally tested this, as I've only worked to support nodejs. I don't even know if any of it works in deno, or any other JS/TS environments.

regarding disableFS: just to make sure that you are aware, this will disable support for TIFFs completely. other image formats will work as expected.

I'm testing it in node env, web worker for Nextjs for specific.
Ive tried to wrapped DataUrl into Buffer.from() but it didnt workout, too(it does for arrayBuffer).
Even Buffer.from(DataUrl, 'base64 or utf-8'). Btw ty for your support.

कारतोफ्फेलस्क्रिप्ट™ · Answer 9 · Mon Nov 15 2021 20:52:02 GMT+0800 (China Standard Time)

I'm testing it in node env, web worker for Nextjs for specific. Ive tried to wrapped DataUrl into Buffer.from() but it didnt workout, too(it does for arrayBuffer). Even Buffer.from(DataUrl, 'base64 or utf-8').

Since I'm not actively working with node.js or frontend, I don't even know where to start to fix these issues.
If something is broken, or if you'd like this module to support certain scenarios, please create a test repo on github with minimal setup, and let me know.
If I can reproduce it, I can try to fix it. Without a repo like that, I have no code-base to debug, validate, and fix these.

Btw ty for your support.

You are most welcome 💟