Could not dynamically require "../src/build/Release/sharp-win32-x64.node". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option of @rollup/plugin-commonjs

[guanzhongxu]

I am developing an executable application using vite, Vue 3, and Electron. I need to use Sharp for image format conversion, but I encounter an error during startup. The error message is as follows:

Error: Could not load the "sharp" module using the win32-x64 runtime

What are you trying to achieve?

The code runs successfully.

Complete error message:

Error: Could not load the "sharp" module using the win32-x64 runtime
undefined: Could not dynamically require "../src/build/Release/sharp-win32-x64.node". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires opti
on of @rollup/plugin-commonjs appropriately for this require call to work.
undefined: Could not dynamically require "../src/build/Release/sharp-wasm32.node". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option
of @rollup/plugin-commonjs appropriately for this require call to work.
undefined: Could not dynamically require "@img/sharp-win32-x64/sharp.node". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option of @rol
lup/plugin-commonjs appropriately for this require call to work.
undefined: Could not dynamically require "@img/sharp-wasm32/sharp.node". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option of @rollup
/plugin-commonjs appropriately for this require call to work.
Possible solutions:

• Ensure optional dependencies can be installed:
  npm install --include=optional sharp
  yarn add sharp --ignore-engines
• Ensure your package manager supports multi-platform installation:
  See https://sharp.pixelplumbing.com/install#cross-platform
• Add platform-specific dependencies:
  npm install --os=win32 --cpu=x64 sharp
• Consult the installation documentation:
  See https://sharp.pixelplumbing.com/install
  at Object. (D:\code\2024\2024.1\picture-conversion\dist-electron\main.js:4185:9)
  at Module._compile (node:internal/modules/cjs/loader:1271:14)
  at Module._extensions..js (node:internal/modules/cjs/loader:1326:10)
  at Module.load (node:internal/modules/cjs/loader:1126:32)
  at Module._load (node:internal/modules/cjs/loader:967:12)
  at l._load (node:electron/js2c/asar_bundle:2:13642)
  at ModuleWrap. (node:internal/modules/esm/translators:169:29)
  at ModuleJob.run (node:internal/modules/esm/module_job:194:25)

I have tried to resolve the issue.

npm install --include=optional sharp
npm install --os=win32 --cpu=x64 sharp
In the vite.config.ts file, I configured the esbuild option as follows:

esbuild: {
  exclude: ["sharp"]
}，
plugins：[
common({
  dynamicRequireTargets: [
    "../src/build/Release/sharp-win32-x64.node",
    "../src/build/Release/sharp-wasm32.node",
    `@img/sharp-win32-x64/sharp.node`,
    "@img/sharp-wasm32/sharp.node"
  ],
  ignoreDynamicRequires: true
}),
... other plugins
]

However, none of these solutions worked.

[guanzhongxu]

Oh, right!

I tried using only Node and Sharp for image conversion, and the program was successful. The same code also runs successfully in a standalone Electron environment. The issue seems to arise only when using Vite with Electron. I suspect it might be related to configuration issues with esbuild or Rollup. I would appreciate your guidance on this.
thank！！！

[lovell]

Did you see https://sharp.pixelplumbing.com/install#bundlers ? You may need to mark sharp as external.

Could not dynamically require "../src/build/Release/sharp-win32-x64.node". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option of @rollup/plugin-commonjs

https://github.com/rollup/plugins/tree/master/packages/commonjs#dynamicrequiretargets suggests the paths need to be relative to the directory that contains node_modules.

[guanzhongxu]

Thank you very much for your response, but even after adding the following configuration, it still doesn't run properly.

And I also added the following configuration in the Electron packaging settings:
"asarUnpack": [
"/node_modules/sharp//",
"/node_modules/@img//"
]

but now there is still an error, and the error message is as follows

I am currently using Node.js version 20.10.0.

I'm looking forward to your response.
Once again, thank you for your response.

[guanzhongxu]

I just upgraded the Electron Node version, and the issue has been resolved.

[guanzhongxu]

I've identified the problematic code, and it's located here:

[3D-Bear]

Hi, I'm running into the same problem.

I am trying to package an Electron App (using Vue3, Vite, and electron-packager through Quasar framework) for Windows, from a Linux dev environment.

I adapted the electron-builder configuration (asarUnpack) suggested in the doc for electron packager and I managed to have both nodes_modules/sharp and node_modules/@img outside the asar archive generated by electron.

asar: {unpackDir: path.join('**','node_modules','{sharp,@img}','**','*')}

The thing is that in the final build, the 'sharp-win32-x64.node' file is not located in one of the paths of the sharp.js file. (those mentionned by @guanzhongxu in the previous post).

I managed to make it work by modifying directly the production code with the absolute path of 'sharp-win32-x64.node' file, but this is of course a terribly ugly workaround. (I also had to copy manually the win32 version next to the linux one but i guess this is another issue linked to npm and optional dependencies)

Thank you for your help and this incredibly fast library 👏

[lovell]

Is sharp listed in dependencies or devDependencies? If the latter, please try the former.

Failing that a minimal, standalone repo that allows someone else to reproduce is the best next step.

[3D-Bear]

It is in the "dependencies".
Here is a simple repo to reproduce my case (I'm not sure that it is 100% corresponding to the original question but I think it is still related).
The repo : https://github.com/3D-Bear/quasar-electron-sharp-issue-repro

[lovell]

@3D-Bear If you need to support multiple platforms within the same installation tree then npm may (currently) be the wrong choice of package manager. Please try the supportedArchitectures feature of both yarn v3+ and pnpm - see https://sharp.pixelplumbing.com/install#cross-platform

[guanzhongxu]

Thank you very much for your guidance. I tried rolling back the version of Sharp to 0.32.5 and modified the import code in the sharp.js file. I'm delighted to report that the program is now running successfully. Once again, thank you for your assistance and also for providing this efficient library.

[lovell]

Thanks for the updates. Downgrading to an unsupported version and hard-coding paths doesn't quite feel like the right approach. If you can create a repo that allows someone else to reproduce then I can try to help further.

[guanzhongxu]

Thank you very much for your reply. If you don't mind, please take a look at my code when it's convenient for you. Currently, the code is still using version 0.32.5, and I manually modified the code for the screenshot part shown above. If you can address the issues with the latest version in Electron + Vite, feel free to modify my code. My computer is running on the Windows 10 operating system.If it's inconvenient for you, that's okay; you're already awesome!
The following is my repository address: https://github.com/guanzhongxu/img-transform.git

[lovell]

@guanzhongxu The problem you're facing is that electron-builder does not support pnpm symlinks - please see develar/app-builder#84

[guanzhongxu]

@lovell Thank you very much for your answer.

[3D-Bear]

@lovell I switched from npm to yarn (had to pay attention to explicitely install v3+ which isn't installed by default), and it is working fine. Just like you said I also had to add the supportedArchitectures option in yarnrc.yml.

I updated my repo with the solution if someone runs into the same issue.

Thank you again for your help and this great lib !

[s4ms00n9]

I don't get it: why the issue was closed? It's been said that 'npm is not the best solution for cross-platform, use sth else', but it did work in a 0.32.x version of Sharp. It fails with the latest version and the recommended solution is not to use npm? Or to downgrade Sharp?

[lovell]

@s4ms00n9 Please see #3750 for the wider context about why your choice of package manager is now important from v0.33.0 onwards.