我尝试使用create-react-app创建一个react演示，但总是出错，我的node -v是18.17.1，它是mac m1，感谢您的帮助！
Creating a new React app in /Users/gengyinshan/gys/kwr-chrome-extension.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template-typescript...
npm ERR! code 1
npm ERR! path /Users/gengyinshan/gys/kwr-chrome-extension/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 '/Users/gengyinshan/.nvm/versions/node/v18.17.1/bin/node /Users/gengyinshan/.nvm/versions/node/v18.17.1/lib/node_modules/npm/node_modules/@npmcli/run-script/node_modules/node-gyp/bin/node-gyp.js configure --fallback-to-build --update-binary --module=/Users/gengyinshan/gys/kwr-chrome-extension/node_modules/canvas/build/Release/canvas.node --module_name=canvas --module_path=/Users/gengyinshan/gys/kwr-chrome-extension/node_modules/canvas/build/Release --napi_version=9 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v108' (1)
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-node-v108-darwin-unknown-arm64.tar.gz
npm ERR! Package pixman-1 was not found in the pkg-config search path.
npm ERR! Perhaps you should add the directory containing `pixman-1.pc'
npm ERR! to the PKG_CONFIG_PATH environment variable
npm ERR! No package 'pixman-1' found
npm ERR! gyp: Call to 'pkg-config pixman-1 --libs' returned exit status 1 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 (/Users/gengyinshan/.nvm/versions/node/v18.17.1/lib/node_modules/npm/node_modules/@npmcli/run-script/node_modules/node-gyp/lib/configure.js:325:16)
npm ERR! gyp ERR! stack at ChildProcess.emit (node:events:514:28)
npm ERR! gyp ERR! stack at ChildProcess._handle.onexit (node:internal/child_process:291:12)
npm ERR! gyp ERR! System Darwin 22.1.0
npm ERR! gyp ERR! command "/Users/gengyinshan/.nvm/versions/node/v18.17.1/bin/node" "/Users/gengyinshan/.nvm/versions/node/v18.17.1/lib/node_modules/npm/node_modules/@npmcli/run-script/node_modules/node-gyp/bin/node-gyp.js" "configure" "--fallback-to-build" "--update-binary" "--module=/Users/gengyinshan/gys/kwr-chrome-extension/node_modules/canvas/build/Release/canvas.node" "--module_name=canvas" "--module_path=/Users/gengyinshan/gys/kwr-chrome-extension/node_modules/canvas/build/Release" "--napi_version=9" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v108"
npm ERR! gyp ERR! cwd /Users/gengyinshan/gys/kwr-chrome-extension/node_modules/canvas
npm ERR! gyp ERR! node -v v18.17.1
npm ERR! gyp ERR! node-gyp -v v9.4.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 '/Users/gengyinshan/.nvm/versions/node/v18.17.1/bin/node /Users/gengyinshan/.nvm/versions/node/v18.17.1/lib/node_modules/npm/node_modules/@npmcli/run-script/node_modules/node-gyp/bin/node-gyp.js configure --fallback-to-build --update-binary --module=/Users/gengyinshan/gys/kwr-chrome-extension/node_modules/canvas/build/Release/canvas.node --module_name=canvas --module_path=/Users/gengyinshan/gys/kwr-chrome-extension/node_modules/canvas/build/Release --napi_version=9 --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/gengyinshan/gys/kwr-chrome-extension/node_modules/@mapbox/node-pre-gyp/lib/util/compile.js:89:23)
npm ERR! node-pre-gyp ERR! stack at ChildProcess.emit (node:events:514: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 22.1.0
npm ERR! node-pre-gyp ERR! command "/Users/gengyinshan/.nvm/versions/node/v18.17.1/bin/node" "/Users/gengyinshan/gys/kwr-chrome-extension/node_modules/.bin/node-pre-gyp" "install" "--fallback-to-build" "--update-binary"
npm ERR! node-pre-gyp ERR! cwd /Users/gengyinshan/gys/kwr-chrome-extension/node_modules/canvas
npm ERR! node-pre-gyp ERR! node -v v18.17.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: /Users/gengyinshan/.npm/_logs/2023-09-25T22_49_47_655Z-debug-0.log
Aborting installation.
npm install --no-audit --save --save-exact --loglevel error react react-dom react-scripts cra-template-typescript has failed.
Deleting generated file... package.json
Deleting kwr-chrome-extension/ from /Users/gengyinshan/gys
Done.
我尝试更改节点版本，npm cache clean --force 但仍然失败！
根据提供的错误消息，问题似乎与node-canvas包的安装有关。具体来说，错误消息提到在 pkg-config 搜索路径中找不到软件包 pixman-1，并且在尝试时调用了“pkg-config pixman-1 --libs”，该调用返回退出状态 1加载绑定.gyp。此错误消息与here和here报告的错误消息类似，这表明该问题可能与pkg-config、cairo、pango、libpng、jpeg、giflib和librsvg等依赖项的安装有关。
既然您使用的是 Mac M1，请尝试这个
brew install pkg-config cairo pango libpng jpeg giflib librsvg