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/liujianchuan/Tutorial/my-react-project/my-react-app/node_modules/canvas
npm ERR! command failed
npm ERR! command sh -c -- node-gyp rebuild
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/liujianchuan/Tutorial/my-react-project/my-react-app/node_modules/node-gyp/lib/configure.js:259: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" "/Users/liujianchuan/Tutorial/my-react-project/my-react-app/node_modules/.bin/node-gyp" "rebuild"
npm ERR! gyp ERR! cwd /Users/liujianchuan/Tutorial/my-react-project/my-react-app/node_modules/canvas
npm ERR! gyp ERR! node -v v18.12.1
npm ERR! gyp ERR! node-gyp -v v8.4.1
npm ERR! gyp ERR! not ok
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/liujianchuan/.npm/_logs/2022-11-15T01_46_01_465Z-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 my-react-app/ from /Users/liujianchuan/Tutorial/my-react-project
Done.
liujianchuan@ZBMac-C02F90L3M-6 ~/Tutorial/my-react-project node -v 1 ↵ 10626 09:47:01
v18.12.1
liujianchuan@ZBMac-C02F90L3M-6 ~/Tutorial/my-react-project sh -c -- node-gyp rebuild ✔ 10627 09:47:08
rebuild: node-gyp: command not found
liujianchuan@ZBMac-C02F90L3M-6 ~/Tutorial/my-react-project node -v 127 ↵ 10628 09:47:28
v18.12.1
liujianchuan@ZBMac-C02F90L3M-6 ~/Tutorial/my-react-project node -v ✔ 10629 09:47:30
v18.12.1
liujianchuan@ZBMac-C02F90L3M-6 ~/Tutorial/my-react-project sudo n ✔ 10629 09:49:08
Password:
installed : v16.14.2 (with npm 8.5.0)
liujianchuan@ZBMac-C02F90L3M-6 ~/Tutorial/my-react-project node -v ✔ 10630 09:49:38
v16.14.2
liujianchuan@ZBMac-C02F90L3M-6 ~/Tutorial/my-react-project npx create-react-app my-react-app --template typescript
Creating a new React app in /Users/liujianchuan/Tutorial/my-react-project/my-react-app.
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/liujianchuan/Tutorial/my-react-project/my-react-app/node_modules/canvas
npm ERR! command failed
npm ERR! command sh -c node-gyp rebuild
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/liujianchuan/Tutorial/my-react-project/my-react-app/node_modules/node-gyp/lib/configure.js:259:16)
npm ERR! gyp ERR! stack at ChildProcess.emit (node:events:526:28)
npm ERR! gyp ERR! stack at Process.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" "/Users/liujianchuan/Tutorial/my-react-project/my-react-app/node_modules/.bin/node-gyp" "rebuild"
npm ERR! gyp ERR! cwd /Users/liujianchuan/Tutorial/my-react-project/my-react-app/node_modules/canvas
npm ERR! gyp ERR! node -v v16.14.2
npm ERR! gyp ERR! node-gyp -v v8.4.1
npm ERR! gyp ERR! not ok
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/liujianchuan/.npm/_logs/2022-11-15T02_01_43_860Z-debug-0.log