解决create-react-app创建项目出错

最新推荐文章于 2022-12-13 18:52:13 发布

Mr-阿梓

最新推荐文章于 2022-12-13 18:52:13 发布

阅读量1.5k

点赞数

分类专栏：笔记文章标签： react.js node.js javascript

本文链接：https://blog.csdn.net/m0_55986526/article/details/120643485

版权

笔记专栏收录该内容

14 篇文章 0 订阅

订阅专栏

在尝试使用npm安装包含canvas模块的react应用时遇到错误。问题源于缺失的GTK库文件和编译错误，如C1083：无法打开包括文件：'cairo.h'。解决方法是全局安装yarn后再进行项目创建，这能避免该问题并成功安装所需包。

摘要由CSDN通过智能技术生成

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 C:\Users\MHX\Desktop\react-demo\node_modules\canvas
npm ERR! command failed
npm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c node-gyp rebuild
npm ERR! Warning: Missing input files:
npm ERR! C:\GTK\bin\libpangoft2-1.0-0.dll
npm ERR! C:\GTK\bin\zlib1.dll
npm ERR! C:\GTK\bin\libintl-8.dll
npm ERR! C:\GTK\bin\libgmodule-2.0-0.dll
npm ERR! C:\GTK\bin\libglib-2.0-0.dll
npm ERR! C:\GTK\bin\libexpat-1.dll
npm ERR! C:\GTK\bin\libpng14-14.dll
npm ERR! C:\GTK\bin\libcairo-2.dll
npm ERR! C:\GTK\bin\libfontconfig-1.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\libpangocairo-1.0-0.dll
npm ERR! C:\GTK\bin\libfreetype-6.dll
npm ERR! C:\GTK\bin\libpango-1.0-0.dll
npm ERR! C:\GTK\bin\libpangowin32-1.0-0.dll
npm ERR! �ڴ˽��������һ������һ����Ŀ����Ҫ���ò������ɣ������ӡ�/m�����ء�
npm ERR!   Backend.cc
npm ERR! c:\users\mhx\desktop\react-demo\node_modules\canvas\src\backend\backend.h(3): fatal error C1083: �޷��򿪰��  ��ļ�: ��cairo.h��: No such file or directory [C:\Users\MHX\Desktop\react-demo\node_modules\canvas\build\canvas.vcxproj]
npm ERR! gyp ERR! build error
npm ERR! gyp ERR! stack Error: `C:\Program Files (x86)\Microsoft Visual Studio\2017\BuildTools\MSBuild\15.0\Bin\MSBuild.exe` failed with exit code: 1
npm ERR! gyp ERR! stack     at ChildProcess.onExit (C:\Users\MHX\Desktop\react-demo\node_modules\node-gyp\lib\build.js:194:23)
npm ERR! gyp ERR! stack     at ChildProcess.emit (events.js:315:20)
npm ERR! gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:277:12)
npm ERR! gyp ERR! System Windows_NT 10.0.19043
npm ERR! gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\MHX\\Desktop\\react-demo\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild"
npm ERR! gyp ERR! cwd C:\Users\MHX\Desktop\react-demo\node_modules\canvas
npm ERR! gyp ERR! node -v v14.16.0
npm ERR! gyp ERR! node-gyp -v v7.1.2
npm ERR! gyp ERR! not ok
npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\MHX\AppData\Local\npm-cache\_logs\2021-08-18T07_22_00_214Z-debug.log
Aborting installation.
  npm install --save --save-exact --loglevel error react react-dom react-scripts cra-template-typescript has failed.
Deleting generated file... node_modules
(node:22516) UnhandledPromiseRejectionWarning: Error: EBUSY: resource busy or locked, rmdir 'C:\Users\MHX\Desktop\react-demo\node_modules\node-sass'
    at Object.rmdirSync (fs.js:890:10)
    at rmdirSync (C:\Users\MHX\AppData\Roaming\npm\node_modules\create-react-app\node_modules\fs-extra\lib\remove\rimraf.js:264:13)
    at rimrafSync (C:\Users\MHX\AppData\Roaming\npm\node_modules\create-react-app\node_modules\fs-extra\lib\remove\rimraf.js:243:7)
    at C:\Users\MHX\AppData\Roaming\npm\node_modules\create-react-app\node_modules\fs-extra\lib\remove\rimraf.js:279:39
    at Array.forEach (<anonymous>)
    at rmkidsSync (C:\Users\MHX\AppData\Roaming\npm\node_modules\create-react-app\node_modules\fs-extra\lib\remove\rimraf.js:279:26)
    at rmdirSync (C:\Users\MHX\AppData\Roaming\npm\node_modules\create-react-app\node_modules\fs-extra\lib\remove\rimraf.js:269:7)
    at Object.rimrafSync [as removeSync] (C:\Users\MHX\AppData\Roaming\npm\node_modules\create-react-app\node_modules\fs-extra\lib\remove\rimraf.js:243:7)
    at C:\Users\MHX\AppData\Roaming\npm\node_modules\create-react-app\createReactApp.js:554:18
    at Array.forEach (<anonymous>)
(Use `node --trace-warnings ...` to show where the warning was created)
(node:22516) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:22516) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

这种情况是没有下载yarn
全局下载yarn之后再进行创建项目则不会出现这个问题