为啥我在创建 React 应用程序时出错？

Posted 2023-02-22

【中文标题】为啥我在创建 React 应用程序时出错？

【英文标题】：Why I got Error while Creating React App?为什么我在创建 React 应用程序时出错？

【发布时间】：2019-06-16 14:39:04

【问题描述】：

我是新手，想学习 ReactJS，我开始使用 npx create-react-app . 命令安装一个新的空文件夹。我有 npm v.6.4.1。当我尝试执行命令时，它给了我一个错误。

Error: EPERM: operation not permitted, mkdir 'C:\Users\LOGIVAR'
TypeError: Cannot read property 'get' of undefined
    at errorHandler (C:\Program Files\nodejs\node_modules\npm\lib\utils\error-handler.js:205:18)
    at C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js:78:20
    at cb (C:\Program Files\nodejs\node_modules\npm\lib\npm.js:228:22)
    at C:\Program Files\nodejs\node_modules\npm\lib\npm.js:266:24
    at C:\Program Files\nodejs\node_modules\npm\lib\config\core.js:83:7
    at Array.forEach (<anonymous>)
    at C:\Program Files\nodejs\node_modules\npm\lib\config\core.js:82:13
    at f (C:\Program Files\nodejs\node_modules\npm\node_modules\once\once.js:25:25)
    at afterExtras (C:\Program Files\nodejs\node_modules\npm\lib\config\core.js:173:20)
    at C:\Program Files\nodejs\node_modules\npm\node_modules\mkdirp\index.js:47:53
C:\Program Files\nodejs\node_modules\npm\lib\utils\error-handler.js:205
  if (npm.config.get('json')) 
                 ^

TypeError: Cannot read property 'get' of undefined
    at process.errorHandler (C:\Program Files\nodejs\node_modules\npm\lib\utils\error-handler.js:205:18)
    at process.emit (events.js:182:13)
    at process._fatalException (internal/bootstrap/node.js:485:27)
Install for create-react-app@latest failed with code 7

我已经在 Laravel 空项目上执行了相同的命令，但仍然给我同样的错误。

你能告诉我问题的主要原因是什么以及如何解决这个问题吗？

编辑：我已经以管理员身份运行终端，但我收到另一个错误：

npm ERR! code ENOLOCAL
npm ERR! Could not install from "2\AppData\Roaming\npm-cache\_npx\10552" as it does not contain a package.json file.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\LOGIVAR TY 2\AppData\Roaming\npm-cache\_logs\2019-01-23T04_18_56_036Z-debug.log
Install for create-react-app@latest failed with code 1

【参考方案1】：

如果您仍然面临这个问题，毕竟以上所有 -

我的名字中的空格也有同样的问题，我试过了：

npm 缓存清除 -f npm 缓存验证 用“~！”更新了缓存路径

这些都不适合我，但后来我跑了：

npm -g 安装 npm npm init react-app my-app

...终于成功了。希望这可以帮助那里的人

【参考方案2】：

以下命令对我有用：

npm install -g create-react-app npx create-react-app 项目名称

【参考方案3】：

我也遇到了同样的错误：

Error: EPERM: operation not permitted, mkdir 'C:\Users\Username'
command not found: create-react-app

然后下面的命令对我有用：

npm install -g create-react-app npx create-react-app project-name

【参考方案4】：

我在从 Linkedin Learning 创建一个 React 应用程序时遇到了类似的问题，它有以下命令 - npx create-react-app my-website --use-npm 创建一个新的 React 应用程序，但没有提到它是否需要任何先决条件。

所以为了运行上面的命令，首先安装 create-react-app npm install -g create-react-app

【参考方案5】：

首先全局安装

npm install -g create-react-app

创建您的新应用

npx create-react-app your-app-name

这对我有用

【讨论】：

这个方法是使用最新版本还是全局安装的版本？

@sachuverma 这个方法全局安装最新版本

【参考方案6】：

在我的情况下，实际问题是由于我的 Windows 用户名文件夹中存在空格。通过查看堆栈跟踪的第一行，这里似乎也是这种情况，

Error: EPERM: operation not permitted, mkdir 'C:\Users\LOGIVAR'

由于不存在名为LOGIVAR 的目录，它试图运行mkdir，但不允许对其进行获取操作。

感谢citoreek, g8up & gijswijs，以下是我修复它的方法

运行npm config edit 编辑您的配置，这将在记事本或您配置的编辑器中打开一个文本文件，

然后将cache path从

; cache=C:\Users\Gijs van Dam\AppData\Roaming\npm-cache

到

cache=C:\Users\GIJSVA~1\AppData\Roaming\npm-cache

记得去掉开头的;， 下一个问题是我们如何知道将用户名替换为GIJSVA~1？

有几种方法可以针对这一点，

转到C:\Users打开电源Shell并执行以下命令

cmd /c 目录 /x

这样做的目的是列出当前目录中的所有目录及其短名称，这些短名称不应包含任何空格，并且通常长度为 6 个字符或更少。将该短名称复制到您的用户名目录中，并在您的缓存路径中使用它。

您会注意到这些短名称仅存在于包含空格或长度超过 6 个字符的目录中，对于其余目录，它们的短名称将与其目录名称相同，

如果您不想使用上述命令，则只需删除缓存路径中用户名中的所有空格，然后取用户目录名的前 6 个字符并用 ~1 作为后缀。您也应该将其大写，但它似乎没有任何区别。

编辑完此文件后，保存更改，然后在关闭任何活动的 power shell / bash 进程并重新打开它们后重试。

【讨论】：

刚刚更新 npm 配置中的cache 如上所述为我修复了它。 F windows 再一次，在 Mac 上永远不会出现这些问题。

他们真的应该在 create-react-app 入门页面上有这种信息

在我的例子中，我需要修改所有提到我全名的空格。

这正是问题所在。从来没有想过这个。非常感谢。

【参考方案7】：

上述问题是由于文件夹名称中包含空格所致。最好的办法是修改配置文件。

输入npm config edit 进入你的配置文件

那就换

; cache=C:\Users\Sinojia Zeel\AppData\Roaming\npm-cache

到

cache=C:\Users\SINOJI~1\AppData\Roaming\npm-cache

别忘了去掉前面的分号

SINOJI~1 可以替换为包含空格的文件夹名称。 只需取文件名的前 6 个字母并在后缀中添加 ~1（文件名是否大写是可选的，但通常会这样做）

保存文件并退出并重新运行npx create-react-app . 命令。

【参考方案8】：

首先安装create-react-app

npm  install create-react-app

然后

npx create-react-app app-name

【讨论】：

如果你使用 npx create-react-app 不需要安装 create-react-app

【参考方案9】：

这是 npx 的问题。您的计算机名称中有一个空格。我建议 npm install -g create-react-app 来解决 npx 问题。

【参考方案10】：

在你的命令中添加这样的项目名称：

 npx create-react-app your-project-name

【参考方案11】：

您是否尝试过以管理员身份运行它？

【讨论】：

我在 phpStorm 终端上运行它。我不确定它是否以管理员身份运行

尝试以管理员身份运行它，因为您的操作不被允许

它有效。但它给了我另一个错误。我会在我的问题上编辑它

好的，我应该评论这个

试试这个命令：npm install -g create-react-app，我参考了这个命令：github.com/facebook/create-react-app/issues/4058