Building/installing on M1 (Apple Silicon ARM)

[0xjones]

• I have tried with the newest version of editly: npm i -g editly or npm i editly@latest
• I have tried ffmpeg newest stable version
• I have searched for existing issues

Hello,
I haven't been able to install editly via npm at all. I consistently get these errors:

npm i editly@latest

npm WARN deprecated w3c-hr-time@1.0.2: Use your platform's native performance.now() and performance.timeOrigin.
npm ERR! code 1
npm ERR! path /Users/ethanwizard/Desktop/ethan/BRM/node_modules/canvas
npm ERR! command failed
npm ERR! command sh -c -- node-pre-gyp install --fallback-to-build --update-binary
npm ERR! Failed to execute '/usr/local/bin/node /usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js configure --fallback-to-build --update-binary --module=/Users/ethanwizard/Desktop/ethan/BRM/node_modules/canvas/build/Release/canvas.node --module_name=canvas --module_path=/Users/ethanwizard/Desktop/ethan/BRM/node_modules/canvas/build/Release --napi_version=8 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v108' (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.10
npm ERR! node-pre-gyp info using node@18.12.1 | darwin | arm64
npm ERR! node-pre-gyp http GET https://github.com/Automattic/node-canvas/releases/download/v2.11.0/canvas-v2.11.0-node-v108-darwin-unknown-arm64.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.0/canvas-v2.11.0-node-v108-darwin-unknown-arm64.tar.gz 
npm ERR! node-pre-gyp WARN Pre-built binaries not installable for canvas@2.11.0 and node@18.12.1 (node-v108 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.0/canvas-v2.11.0-node-v108-darwin-unknown-arm64.tar.gz 
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp info using node-gyp@9.1.0
npm ERR! gyp info using node@18.12.1 | darwin | arm64
npm ERR! gyp info ok 
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp info using node-gyp@9.1.0
npm ERR! gyp info using node@18.12.1 | darwin | arm64
npm ERR! gyp info find Python using Python version 3.11.1 found at "/Library/Frameworks/Python.framework/Versions/3.11/bin/python3"
npm ERR! gyp http GET https://nodejs.org/download/release/v18.12.1/node-v18.12.1-headers.tar.gz
npm ERR! gyp http 200 https://nodejs.org/download/release/v18.12.1/node-v18.12.1-headers.tar.gz
npm ERR! gyp http GET https://nodejs.org/download/release/v18.12.1/SHASUMS256.txt
npm ERR! gyp http 200 https://nodejs.org/download/release/v18.12.1/SHASUMS256.txt
npm ERR! gyp info spawn /Library/Frameworks/Python.framework/Versions/3.11/bin/python3
npm ERR! gyp info spawn args [
npm ERR! gyp info spawn args   '/usr/local/lib/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   'make',
npm ERR! gyp info spawn args   '-I',
npm ERR! gyp info spawn args   '/Users/ethanwizard/Desktop/ethan/BRM/node_modules/canvas/build/config.gypi',
npm ERR! gyp info spawn args   '-I',
npm ERR! gyp info spawn args   '/usr/local/lib/node_modules/npm/node_modules/node-gyp/addon.gypi',
npm ERR! gyp info spawn args   '-I',
npm ERR! gyp info spawn args   '/Users/ethanwizard/Library/Caches/node-gyp/18.12.1/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=/Users/ethanwizard/Library/Caches/node-gyp/18.12.1',
npm ERR! gyp info spawn args   '-Dnode_gyp_dir=/usr/local/lib/node_modules/npm/node_modules/node-gyp',
npm ERR! gyp info spawn args   '-Dnode_lib_file=/Users/ethanwizard/Library/Caches/node-gyp/18.12.1/<(target_arch)/node.lib',
npm ERR! gyp info spawn args   '-Dmodule_root_dir=/Users/ethanwizard/Desktop/ethan/BRM/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   'build',
npm ERR! gyp info spawn args   '-Goutput_dir=.'
npm ERR! gyp info spawn args ]
npm ERR! /bin/sh: pkg-config: command not found
npm ERR! gyp: Call to 'pkg-config pixman-1 --libs' returned exit status 127 while in binding.gyp. while trying to load binding.gyp
npm ERR! gyp ERR! configure error 
npm ERR! gyp ERR! stack Error: `gyp` failed with exit code: 1
npm ERR! gyp ERR! stack     at ChildProcess.onCpExit (/usr/local/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:284:16)
npm ERR! gyp ERR! stack     at ChildProcess.emit (node:events:513:28)
npm ERR! gyp ERR! stack     at ChildProcess._handle.onexit (node:internal/child_process:291:12)
npm ERR! gyp ERR! System Darwin 21.6.0
npm ERR! gyp ERR! command "/usr/local/bin/node" "/usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "configure" "--fallback-to-build" "--update-binary" "--module=/Users/ethanwizard/Desktop/ethan/BRM/node_modules/canvas/build/Release/canvas.node" "--module_name=canvas" "--module_path=/Users/ethanwizard/Desktop/ethan/BRM/node_modules/canvas/build/Release" "--napi_version=8" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v108"
npm ERR! gyp ERR! cwd /Users/ethanwizard/Desktop/ethan/BRM/node_modules/canvas
npm ERR! gyp ERR! node -v v18.12.1
npm ERR! gyp ERR! node-gyp -v v9.1.0
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 '/usr/local/bin/node /usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js configure --fallback-to-build --update-binary --module=/Users/ethanwizard/Desktop/ethan/BRM/node_modules/canvas/build/Release/canvas.node --module_name=canvas --module_path=/Users/ethanwizard/Desktop/ethan/BRM/node_modules/canvas/build/Release --napi_version=8 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v108' (1)
npm ERR! node-pre-gyp ERR! stack     at ChildProcess.<anonymous> (/Users/ethanwizard/Desktop/ethan/BRM/node_modules/@mapbox/node-pre-gyp/lib/util/compile.js:89:23)
npm ERR! node-pre-gyp ERR! stack     at ChildProcess.emit (node:events:513:28)
npm ERR! node-pre-gyp ERR! stack     at maybeClose (node:internal/child_process:1091:16)
npm ERR! node-pre-gyp ERR! stack     at ChildProcess._handle.onexit (node:internal/child_process:302:5)
npm ERR! node-pre-gyp ERR! System Darwin 21.6.0
npm ERR! node-pre-gyp ERR! command "/usr/local/bin/node" "/Users/ethanwizard/Desktop/ethan/BRM/node_modules/.bin/node-pre-gyp" "install" "--fallback-to-build" "--update-binary"
npm ERR! node-pre-gyp ERR! cwd /Users/ethanwizard/Desktop/ethan/BRM/node_modules/canvas
npm ERR! node-pre-gyp ERR! node -v v18.12.1
npm ERR! node-pre-gyp ERR! node-pre-gyp -v v1.0.10
npm ERR! node-pre-gyp ERR! not ok

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/ethanwizard/.npm/_logs/2023-01-01T11_42_50_621Z-debug-0.log

I am running Mac OS Monterey 12.5.1. I have the latest versions of node.js, python, ffmpeg and ffprobe installed as of today. Sorry if I am missing something obvious here 😅

[mifi]

It seems node-canvas doesn't work on apple siliicon out of the box.
I did some googling and found this:

• Bundling a prebuild version on Apple M1 fails Automattic/node-canvas#2036
• https://stackoverflow.com/questions/74239415/unable-to-install-node-canvas-on-m1-mac
• https://stackoverflow.com/questions/51161225/how-can-i-make-macos-frameworks-available-to-clang-in-a-nix-environment

hope it helps

[0xjones]

I don't think I have the expertise to resolve this but thank you for looking into this @mifi

[mifi]

I don't have much time to work on this now, so I think we can only wait for someone to improve the situation with node-canvas and apple silicon

[ubaranzorlu]

I've been running editly in Apple Silicon on Node v18.12.1

My yarn.lock quotes version for other dependencies as follows:

editly@^0.14.1:
version "0.14.2"
resolved "https://registry.yarnpkg.com/editly/-/editly-0.14.2.tgz#cab94f0b627057ab6c6515a1592f98ffda12b1cc"
integrity sha512-XSeoZIM+wopCTEnOEFMSjvJ5fuQHhjeoOCkzDl1ZkpPlP4TqaTBArrHtRM+YlK6flhNxM3CCAt9O8XNn65cBBw==
dependencies:
canvas "^2.9.3"
compare-versions "^4.1.4"
execa "^6.1.0"
fabric "^5.2.4"
file-type "^18.0.0"
file-url "^4.0.0"
fs-extra "^10.1.0"
gl "^5.0.3"
gl-buffer "^2.1.2"
gl-shader "^4.3.1"
gl-texture2d "^2.1.0"
gl-transition "^1.13.0"
gl-transitions "^1.43.0"
json5 "^2.2.1"
lodash-es "^4.17.21"
meow "^10.1.3"
nanoid "^4.0.0"
ndarray "^1.0.19"
p-map "^5.5.0"

[codergautam]

I had the same error on my Macbook Air M1, was able to fix by downgrading to node.js v14.18.3

[mpj]

@codergautam this worked for me as well.

[jason-dark]

Solution for me (M1 Macbook) was to use pyenv (installed via brew) to manage my Python versions. After doing this and installing Python 3.10 I was able to install Editly.

[bkeepers]

I just release 0.15.0-rc.1, which among other things updates canvas and gl to more modern versions (#282). I'm able to build it fine on a mac with an m2.

Let me know if you have troubles with the latest release.