Electron app with Sharp does not include Sharp dependency during packaging

[james-braund]

Prelim

Did you see the documentation relating to installation? - Yes

Have you ensured the architecture and platform of Node.js used for npm install is the same as the architecture and platform of Node.js used at runtime? - Yes

Are you using the latest version? Is the version currently in use as reported by npm ls sharp the same as the latest version as reported by npm view sharp dist-tags.latest? - Yes - 0.28.2

If you are using npm v6 or earlier and installing as a root or sudo user, have you tried with the npm install --unsafe-perm flag? - Yes

If you are using npm v7, does the user running npm install own the directory it is run in? - N/A, was using v6

If you are using the ignore-scripts feature of npm, have you tried with the npm install --ignore-scripts=false flag? N/A, not using this feature

What is the complete output of running npm install --verbose sharp? Have you checked this output for useful error messages?

Output of following command attached as file:

npm i sharp --verbose --unsafe-perm --build-from-source

sharp-install-verbose.txt

What is the output of running npx envinfo --binaries --system?

$ npx envinfo --binaries --system
npx: installed 1 in 0.97s

  System:
    OS: Linux 4.19 Ubuntu 20.04.2 LTS (Focal Fossa)
    CPU: (4) x64 Intel(R) Core(TM) i5-4670K CPU @ 3.40GHz
    Memory: 16.08 GB / 25.02 GB
    Container: Yes
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 14.15.0 - ~/.nvm/versions/node/v14.15.0/bin/node
    Yarn: 1.22.10 - ~/.nvm/versions/node/v14.15.0/bin/yarn
    npm: 6.14.8 - ~/.nvm/versions/node/v14.15.0/bin/npm

Issue report

I have used electron-forge to generate, and provided packaging/distribution for, my desktop app. The app is written in Typescript, and uses Webpack+React to develop and build the UI.

This app is using Sharp. When I use electron-forge's dev tooling to run the app during development, the Sharp dependency is resolved correctly, and I can use the functionality I need. However, when I package the app, I get the following error:

Uncaught Error: Cannot find module 'sharp'

I have reviewed the documentation, and ensured that I have got the right native binaries installed, and that I have listed the Sharp module as an external dependency in Webpack, but I cannot get this to work.

To help isolate the problem, I have produced a minimal repository which demonstrates the issue, complete with the steps to reproduce, and the way the repository was created. You can find it at:

https://github.com/james-braund/electron-sharp-demo

Any support or guidance you can offer on this would be very much appreciated!

[lovell]

Thanks for the detailed report.

I've not tried it yet but a quick glance at the webpack config suggests that webpack.main.config.js is missing externals and webpack.rules.js needs to have the use of node-loader removed and probably webpack-asset-relocator-loader too, as these will conflict with externals.

https://sharp.pixelplumbing.com/install#webpack

[james-braund]

Thanks for the speedy reply. I tried your suggested fixes (demonstrated here), but no joy - same error.

After a bit of digging, I found this issue raised in the Electron Forge repo, where someone has used hooks to manually inject the dependencies specified in externals to the package. This approach fixed the issue (demonstrated here. I therefore suspect it's an issue with Electron Forge.

I'll raise an issue over there as well to see if they're able to suggest anything else. In the meantime, I'll close this off, since it doesn't seem to be a Sharp issue. Thanks for your help investigating it, and for the great work you do with Sharp - much appreciated!

[ivancuric]

Try using https://github.com/timfish/forge-externals-plugin

Demo repo:
https://github.com/ivancuric/native-repro-sharp