Running electron-builder on Win11 fails when package "pdfjs-dist" is included because of ~/node_modules/canvas

[ahzf]

• Electron-Builder Version: ^24.13.3

• Node Version: v21.7.1

• Electron Version: ^30.0.0
• Electron Type (current, beta, nightly):

• Target: Windows

I have an Elctron ^30.0.0 app with electron-builder ^24.13.3 and it works fine, until I add pdfjs-dist: ^4.1.392! Then I run into the following issue with ~/node_modules/canvas:

  • electron-builder  version=24.9.1 os=10.0.22631
  • loaded configuration  file=package.json ("build" field)
  • rebuilding native dependencies  dependencies=canvas@2.11.2 platform=win32 arch=x64
  ⨯ cannot execute  cause=exit status 1
                    errorOut=npm ERR! code 1
    npm ERR! path D:\Coding\OpenChargingCloud\ChargyDesktopApp\node_modules\canvas
    npm ERR! command failed
    npm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c node-pre-gyp install --fallback-to-build --update-binary
    npm ERR! Warning: Missing input files:
    npm ERR! C:\GTK\bin\libpangowin32-1.0-0.dll
    npm ERR! C:\GTK\bin\libpangoft2-1.0-0.dll
    npm ERR! C:\GTK\bin\libpangocairo-1.0-0.dll
    npm ERR! C:\GTK\bin\libcairo-2.dll
    npm ERR! C:\GTK\bin\libglib-2.0-0.dll
    npm ERR! C:\GTK\bin\libgobject-2.0-0.dll
    npm ERR! C:\GTK\bin\libgthread-2.0-0.dll
    npm ERR! C:\GTK\bin\libexpat-1.dll
    npm ERR! C:\GTK\bin\libfontconfig-1.dll
    npm ERR! C:\GTK\bin\libintl-8.dll
    npm ERR! C:\GTK\bin\libpango-1.0-0.dll
    npm ERR! C:\GTK\bin\libfreetype-6.dll
    npm ERR! C:\GTK\bin\libgmodule-2.0-0.dll
    npm ERR! C:\GTK\bin\libpng14-14.dll
    npm ERR! C:\GTK\bin\zlib1.dll
    npm ERR!
    npm ERR!   Backend.cc
    npm ERR! D:\Coding\OpenChargingCloud\ChargyDesktopApp\node_modules\canvas\src\backend\Backend.h(3,10): error C1083: Cannot open include file: 'cairo.h': No such file or directory [D:\Coding\OpenChargingCloud\ChargyDesktopApp\node_modules\canvas\build\canvas.vcxproj]
    npm ERR!   (compiling source file '../src/backend/Backend.cc')
    npm ERR!
    npm ERR! Failed to execute 'C:\Program Files\nodejs\node.exe C:\Users\achim\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js build --fallback-to-build --update-binary --module=D:\Coding\OpenChargingCloud\ChargyDesktopApp\node_modules\canvas\build\Release\canvas.node --module_name=canvas --module_path=D:\Coding\OpenChargingCloud\ChargyDesktopApp\node_modules\canvas\build\Release --napi_version=9 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=electron-v30.0' (1)
    npm ERR! node-pre-gyp info it worked if it ends with ok
    npm ERR! node-pre-gyp info using node-pre-gyp@1.0.11
    npm ERR! node-pre-gyp info using node@21.7.1 | win32 | x64
    npm ERR! (node:47700) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
    npm ERR! (Use `node --trace-deprecation ...` to show where the warning was created)
    npm ERR! node-pre-gyp http GET https://github.com/Automattic/node-canvas/releases/download/v2.11.2/canvas-v2.11.2-electron-v30.0-win32-unknown-x64.tar.gz
    npm ERR! node-pre-gyp ERR! install response status 404 Not Found on https://github.com/Automattic/node-canvas/releases/download/v2.11.2/canvas-v2.11.2-electron-v30.0-win32-unknown-x64.tar.gz
    npm ERR! node-pre-gyp WARN Pre-built binaries not installable for canvas@2.11.2 and electron@30.0.0 (electron-v30.0 ABI, unknown) (falling back to source compile with node-gyp)
    npm ERR! node-pre-gyp WARN Hit error response status 404 Not Found on https://github.com/Automattic/node-canvas/releases/download/v2.11.2/canvas-v2.11.2-electron-v30.0-win32-unknown-x64.tar.gz
    npm ERR! gyp info it worked if it ends with ok
    npm ERR! gyp info using node-gyp@10.0.1
    npm ERR! gyp info using node@21.7.1 | win32 | x64
    npm ERR! gyp info ok
    npm ERR! gyp info it worked if it ends with ok
    npm ERR! gyp info using node-gyp@10.0.1
    npm ERR! gyp info using node@21.7.1 | win32 | x64
    npm ERR! gyp info find Python using Python version 3.12.1 found at "C:\Python312\python.exe"
    npm ERR! gyp info find VS using VS2022 (17.9.34728.123) found at:
    npm ERR! gyp info find VS "C:\Program Files\Microsoft Visual Studio\2022\Community"
    npm ERR! gyp info find VS run with --verbose for detailed information
    npm ERR! gyp info spawn C:\Python312\python.exe
    npm ERR! gyp info spawn args [
    npm ERR! gyp info spawn args 'C:\\Users\\achim\\AppData\\Roaming\\npm\\node_modules\\npm\\node_modules\\node-gyp\\gyp\\gyp_main.py',
    npm ERR! gyp info spawn args 'binding.gyp',
    npm ERR! gyp info spawn args '-f',
    npm ERR! gyp info spawn args 'msvs',
    npm ERR! gyp info spawn args '-I',
    npm ERR! gyp info spawn args 'D:\\Coding\\OpenChargingCloud\\ChargyDesktopApp\\node_modules\\canvas\\build\\config.gypi',
    npm ERR! gyp info spawn args '-I',
    npm ERR! gyp info spawn args 'C:\\Users\\achim\\AppData\\Roaming\\npm\\node_modules\\npm\\node_modules\\node-gyp\\addon.gypi',
    npm ERR! gyp info spawn args '-I',
    npm ERR! gyp info spawn args 'C:\\Users\\achim\\.electron-gyp\\30.0.0\\include\\node\\common.gypi',
    npm ERR! gyp info spawn args '-Dlibrary=shared_library',
    npm ERR! gyp info spawn args '-Dvisibility=default',
    npm ERR! gyp info spawn args '-Dnode_root_dir=C:\\Users\\achim\\.electron-gyp\\30.0.0',
    npm ERR! gyp info spawn args '-Dnode_gyp_dir=C:\\Users\\achim\\AppData\\Roaming\\npm\\node_modules\\npm\\node_modules\\node-gyp',
    npm ERR! gyp info spawn args '-Dnode_lib_file=C:\\\\Users\\\\achim\\\\.electron-gyp\\\\30.0.0\\\\<(target_arch)\\\\node.lib',
    npm ERR! gyp info spawn args '-Dmodule_root_dir=D:\\Coding\\OpenChargingCloud\\ChargyDesktopApp\\node_modules\\canvas',
    npm ERR! gyp info spawn args '-Dnode_engine=v8',
    npm ERR! gyp info spawn args '--depth=.',
    npm ERR! gyp info spawn args '--no-parallel',
    npm ERR! gyp info spawn args '--generator-output',
    npm ERR! gyp info spawn args 'D:\\Coding\\OpenChargingCloud\\ChargyDesktopApp\\node_modules\\canvas\\build',
    npm ERR! gyp info spawn args '-Goutput_dir=.'
    npm ERR! gyp info spawn args ]
    npm ERR! gyp info ok
    npm ERR! gyp info it worked if it ends with ok
    npm ERR! gyp info using node-gyp@10.0.1
    npm ERR! gyp info using node@21.7.1 | win32 | x64
    npm ERR! gyp info spawn C:\Program Files\Microsoft Visual Studio\2022\Community\MSBuild\Current\Bin\MSBuild.exe
    npm ERR! gyp info spawn args [
    npm ERR! gyp info spawn args 'build\\binding.sln',
    npm ERR! gyp info spawn args '/clp:Verbosity=minimal',
    npm ERR! gyp info spawn args '/nologo',
    npm ERR! gyp info spawn args '/p:Configuration=Release;Platform=x64'
    npm ERR! gyp info spawn args ]
    npm ERR! gyp ERR! build error
    npm ERR! gyp ERR! stack Error: `C:\Program Files\Microsoft Visual Studio\2022\Community\MSBuild\Current\Bin\MSBuild.exe` failed with exit code: 1
    npm ERR! gyp ERR! stack at ChildProcess.<anonymous> (C:\Users\achim\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\lib\build.js:209:23)
    npm ERR! gyp ERR! stack at ChildProcess.emit (node:events:519:28)
    npm ERR! gyp ERR! stack at ChildProcess._handle.onexit (node:internal/child_process:294:12)
    npm ERR! gyp ERR! System Windows_NT 10.0.22631
    npm ERR! gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\achim\\AppData\\Roaming\\npm\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "build" "--fallback-to-build" "--update-binary" "--module=D:\\Coding\\OpenChargingCloud\\ChargyDesktopApp\\node_modules\\canvas\\build\\Release\\canvas.node" "--module_name=canvas" "--module_path=D:\\Coding\\OpenChargingCloud\\ChargyDesktopApp\\node_modules\\canvas\\build\\Release" "--napi_version=9" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=electron-v30.0"
    npm ERR! gyp ERR! cwd D:\Coding\OpenChargingCloud\ChargyDesktopApp\node_modules\canvas
    npm ERR! gyp ERR! node -v v21.7.1
    npm ERR! gyp ERR! node-gyp -v v10.0.1
    npm ERR! gyp ERR! not ok
    npm ERR! node-pre-gyp ERR! build error
    npm ERR! node-pre-gyp ERR! stack Error: Failed to execute 'C:\Program Files\nodejs\node.exe C:\Users\achim\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js build --fallback-to-build --update-binary --module=D:\Coding\OpenChargingCloud\ChargyDesktopApp\node_modules\canvas\build\Release\canvas.node --module_name=canvas --module_path=D:\Coding\OpenChargingCloud\ChargyDesktopApp\node_modules\canvas\build\Release --napi_version=9 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=electron-v30.0' (1)
    npm ERR! node-pre-gyp ERR! stack     at ChildProcess.<anonymous> (D:\Coding\OpenChargingCloud\ChargyDesktopApp\node_modules\@mapbox\node-pre-gyp\lib\util\compile.js:89:23)
    npm ERR! node-pre-gyp ERR! stack     at ChildProcess.emit (node:events:519:28)
    npm ERR! node-pre-gyp ERR! stack     at maybeClose (node:internal/child_process:1105:16)
    npm ERR! node-pre-gyp ERR! stack     at ChildProcess._handle.onexit (node:internal/child_process:305:5)
    npm ERR! node-pre-gyp ERR! System Windows_NT 10.0.22631
    npm ERR! node-pre-gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "D:\\Coding\\OpenChargingCloud\\ChargyDesktopApp\\node_modules\\@mapbox\\node-pre-gyp\\bin\\node-pre-gyp" "install" "--fallback-to-build" "--update-binary"
    npm ERR! node-pre-gyp ERR! cwd D:\Coding\OpenChargingCloud\ChargyDesktopApp\node_modules\canvas
    npm ERR! node-pre-gyp ERR! node -v v21.7.1
    npm ERR! node-pre-gyp ERR! node-pre-gyp -v v1.0.11
    npm ERR! node-pre-gyp ERR! not ok

    npm ERR! A complete log of this run can be found in: C:\Users\achim\AppData\Local\npm-cache\_logs\2024-04-16T23_48_25_973Z-debug-0.log

                    command=npm.cmd rebuild canvas@2.11.2
                    workingDir=

Yet, the "funny" solution from this guy https://www.reddit.com/r/electronjs/comments/15gxnmu/electron_builder_error_with_canvas/ works fine. When I just delete ~/node_modules/canvas before I run electron-builder everything works as expected!

webpack 5.91.0 compiled successfully in 4336 ms
  • electron-builder  version=24.9.1 os=10.0.22631
  • loaded configuration  file=package.json ("build" field)
  • packaging       platform=win32 arch=x64 electron=30.0.0 appOutDir=dist\win-unpacked
  • downloading     url=https://github.com/electron/electron/releases/download/v30.0.0/electron-v30.0.0-win32-x64.zip size=109 MB parts=8
  • downloaded      url=https://github.com/electron/electron/releases/download/v30.0.0/electron-v30.0.0-win32-x64.zip duration=5.474s
  • building        target=nsis file=dist\Chargy Transparenzsoftware Setup 1.4.6.exe archs=x64 oneClick=true perMachine=true
  • building block map  blockMapFile=dist\Chargy Transparenzsoftware Setup 1.4.6.exe.blockmap

Any idea how to solve that beside adding the removal of ~/node_modules/canvas into the build script?

The entire Open Source project can be found here: https://github.com/OpenChargingCloud/ChargyDesktopApp

[ImpChiang]

hi, has any solution yet?

[sytolk]

Maybe config is missing for Electron: https://github.com/nodejs/node-gyp?tab=readme-ov-file#build-for-third-party-nodejs-runtimes
I have the same error:

npm ERR! node-pre-gyp WARN Pre-built binaries not installable for canvas@2.11.2 and electron@27.3.11 (electron-v27.3 ABI, unknown) (falling back to source compile with node-gyp)
npm ERR! node-pre-gyp WARN Hit error response status 404 Not Found on https://github.com/Automattic/node-canvas/releases/download/v2.11.2/canvas-v2.11.2-electron-v27.3-win32-unknown-x64.tar.gz

there is no canvas-v2.11.2-electron-v27.3-win32-unknown-x64.tar.gz pre-built package for electron here: https://github.com/Automattic/node-canvas/releases

The electron must be excluded to find binaries and will not try to compile with node-gyp.. or maye we can add canvas-v2.11.2-electron-v27.3 binary in releases @zbjornson ?

I can confirm that it works with "postinstall": "rimraf node_modules/canvas"

[sytolk]

canvas is optional dependency for pdfjs-dist and this fix issue for me: npm install --no-optional

[kotasudhakar]

Maybe config is missing for Electron: https://github.com/nodejs/node-gyp?tab=readme-ov-file#build-for-third-party-nodejs-runtimes I have the same error:

npm ERR! node-pre-gyp WARN Pre-built binaries not installable for canvas@2.11.2 and electron@27.3.11 (electron-v27.3 ABI, unknown) (falling back to source compile with node-gyp)
npm ERR! node-pre-gyp WARN Hit error response status 404 Not Found on https://github.com/Automattic/node-canvas/releases/download/v2.11.2/canvas-v2.11.2-electron-v27.3-win32-unknown-x64.tar.gz

there is no canvas-v2.11.2-electron-v27.3-win32-unknown-x64.tar.gz pre-built package for electron here: https://github.com/Automattic/node-canvas/releases

The electron must be excluded to find binaries and will not try to compile with node-gyp.. or maye we can add canvas-v2.11.2-electron-v27.3 binary in releases @zbjornson ?

I can confirm that it works with "postinstall": "rimraf node_modules/canvas"

Thank you so much, removing this folder node_module/canvas worked for me.