NPM 启动返回错误，“项目依赖树可能有问题”
Posted
技术标签:
【中文标题】NPM 启动返回错误，“项目依赖树可能有问题”【英文标题】：NPM start returns error, "There might be a problem with the project dependency tree" 【发布时间】：2019-10-24 23:05:40 【问题描述】：我是编码新手，并且对我无法正确设置 React 的原因有疑问。我上周挣扎，然后终于成功了。但是现在我又遇到了同样的问题，没有任何效果。
我有一个项目，我从 npx create-react-app 开始，然后当我 cd 进入项目时，我猜是这个问题：
项目依赖树可能有问题。它是 可能不是 Create React App 中的错误，而是您需要修复的问题 本地。
Create React App 提供的 react-scripts 包需要一个 依赖：
“webpack”：“4.29.6”
不要尝试手动安装它：您的包管理器会这样做 自动地。但是，检测到不同版本的 webpack 在树的更高处：
/Users/aliceparker/node_modules/webpack（版本：4.33.0）
已知手动安装不兼容的版本会导致 难以调试的问题。
如果您希望忽略此检查，请添加 SKIP_PREFLIGHT_CHECK=true 到项目中的 .env 文件。那将 永久禁用此消息，但您可能会遇到其他问题。
要修复依赖关系树，请尝试完全按照以下步骤操作 顺序：
删除项目文件夹中的 package-lock.json（不是 package.json！）和/或 yarn.lock。 删除项目文件夹中的 node_modules。 从项目文件夹的 package.json 文件中的依赖项和/或 devDependencies 中删除“webpack”。 运行 npm install 或 yarn，具体取决于您使用的包管理器。
在大多数情况下，这应该足以解决问题。如果这有 没有帮助，您可以尝试其他一些方法：
如果您使用 npm，请安装 yarn (http://yarnpkg.com/) 并使用它重复上述步骤。 这可能会有所帮助，因为 npm 已知包提升问题，这些问题可能会在未来的版本中得到解决。
检查 /Users/aliceparker/node_modules/webpack 是否在您的项目目录之外。 例如，您可能不小心在主文件夹中安装了一些东西。
尝试在您的项目文件夹中运行 npm ls webpack。 这将告诉您安装了 webpack 的其他包（除了预期的 react-scripts）。
如果没有其他帮助，请将 SKIP_PREFLIGHT_CHECK=true 添加到 .env 文件 在你的项目中。这将永久禁用此预检检查 以防万一你想继续。
附：我们知道这条消息很长，但请阅读上面的步骤 :-) 我们希望它们对您有所帮助！
我已按照上述步骤操作。还是得到问题。 我还全局卸载了 webpack 并重新安装了它。
这是我的 package.json 文件的样子：
`
"name": "ravenous-app",
"version": "0.1.0",
"private": true,
"dependencies":
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-scripts": "3.0.1"
,
"scripts":
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
,
"eslintConfig":
"extends": "react-app"
,
"browserslist":
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
`
谁能指导我解决这个问题？ （Ps。我尝试创建一个新项目，但遇到同样的问题......）
【问题讨论】：
我关注了this，它对我有用。 请注意，由于删除 node_modules 或消除错误都不是生产的好解决方案，因此此警告可能来自不同阶段的两个不同包之间的冲突，需要不同的 webpack。例如，react 脚本需要一个 webpack，而故事书需要另一个。 【参考方案1】：问题是安装在您的用户目录中的 webpack。 使用 npm 或手动删除它，一切都应该运行良好： 参考：https://github.com/facebook/create-react-app/issues/6120
【讨论】：
谢谢，如何从我的用户目录中删除它？这一切都让我有点过头了！ 是的，使用 npm install ... -g 标志安装，这与您的本地安装冲突【参考方案2】：您可以按照错误日志中的说明进行操作。
删除package-lock.json（不是package.json！）和/或yarn.lock
您的项目文件夹。
删除项目文件夹中的node_modules。
从依赖项和/或 devDependencies 中删除“webpack”
package.json 项目文件夹中的文件。
运行 npm install 或 yarn，具体取决于您使用的包管理器。
【讨论】：
谢谢。我已经尝试过这些步骤，但请注意，我不确定我是否正确执行了第 3 步。我该怎么做？ 打开 package.json，在 dependencies 或 devDependencies 下删除对 webpack 的引用。 那里没有对 webpack 的引用.. "dependencies": "react": "^16.8.6", "react-dom": "^16.8.6", "react-脚本": "3.0.1" ,【参考方案3】：在终端中，运行：
cd ~
然后：
ls
您应该会看到一个文件列表。如果node_modules 包含在该列表中（看起来应该如此），您想要删除该文件夹。您可以像这样在终端中这样做：
rm -rf node_modules
但请记住：这不会将文件夹发送到垃圾箱。它将不可撤销地删除它。 rm -rf 是一个强大的命令。如果这让您感到紧张，请输入 open .。这将在 Finder 中打开您的“主”(~) 目录，您可以在那里以熟悉的右键单击发送到垃圾箱的方式删除 node_modules。
希望有帮助！
【讨论】：
您是否收到与原始帖子中相同的错误消息？还是有什么不同？编辑：在运行npm start 之前，您是否cd 回到了项目目录？
npm 错误！代码 ELIFECYCLE npm 错误！ errno 1 npm 错误！ react-app@0.1.0 开始：react-scripts start npm ERR！退出状态 1 npm ERR！ npm 错误！ react-app@0.1.0 启动脚本失败。 npm 错误！这可能不是 npm 的问题。上面可能有额外的日志输出。 npm 错误！可以在以下位置找到此运行的完整日志：npm ERR！ /Users/alice/.npm/_logs/2019-06-10T14_56_11_380Z-debug.log Alices-MBP-7:react-app alice$
嗯，也许这个帖子会有所帮助：***.com/questions/42308879/npm-err-code-elifecycle
不幸的是没有:(当我完成这些步骤后，我又回到了同样的问题，重新安装 npm 然后 npm start。
只是为了说明，我已经完成了解决问题的所有步骤，不管它没有工作。我发现我的用户文件夹中有一个 node_modules 文件夹。我删除了这个，但不是我项目中的那个，然后可以使用“npm start”而没有任何问题。【参考方案4】：
当你制作所有项目时，问题在于你计算机上的树文件夹，尝试文件夹中不存在的应用程序，我希望它会工作
【讨论】：
【参考方案5】：删除项目文件夹中的package-lock.json（不是package.json！）和/或yarn.lock。
删除项目文件夹中的node_modules。
从项目文件夹中 package.json 文件中的依赖项和/或 devDependencies 中删除 webpack。
运行 npm install 或 yarn，具体取决于您使用的包管理器。
我尝试了以上所有方法，但没有成功，但是一旦我将 .env 文件添加到我的项目结构中并将SKIP_PREFLIGHT_CHECK=true 添加到文件中。我可以绕过这个问题：
这是您放入 .env 文件中的内容：
【讨论】：
【参考方案6】：就我而言，我以这种方式解决了我的问题
-
在文件夹
react folder 的根目录下创建一个.env
在.env文件中输入SKIP_PREFLIGHT_CHECK=true
现在在 cmd npm start 中运行。
【讨论】：
【参考方案7】：对我有用的解决方案
将SKIP_PREFLIGHT_CHECK=true 添加到项目中的 .env 文件中。不知道以后会不会出错。
【讨论】：
【参考方案8】：按照错误说明执行操作以使其正常工作。
在你的项目目录下创建一个.env文件并添加SKIP_PREFLIGHT_CHECK=true，就可以了。
【讨论】：
这不是解决方案，在大多数情况下它只会隐藏错误，但稍后会出现其他问题。【参考方案9】：我以前遇到过同样的问题，我解决了。
create-react-app 已经提供了webpack(v4.29.6)，与/Users/aliceparker/node_modules 中的webpack(v4.33.0) 冲突。
因此，如果您删除第二个 webpack(v4.33.0)，它将运行。
【讨论】：
【参考方案10】：我使用 npx 创建了项目，并且最初使用 babel-eslint 时遇到了同样的错误。我遵循@davidflyod91 方法，它对我有用。我不满意从 ~ 目录（在我的 MAC 中）删除整个 node_module 文件夹（我的意思是说安装 -g 模块的位置）。因此，我从 ~/node_modules 目录中的 node_modules 中放回了 node_modules 和已删除的文件夹，并尝试运行应用程序（npm run start）。
网页包 巴别塔 eslint 创建反应应用程序然后应用程序开始工作。
【讨论】：
【参考方案11】：你需要尝试
首先，创建一个名为.env 的文件并存储SKIP_PREFLIGHT_CHECK=true
root/.env和.env应该包含SKIP_PREFLIGHT_CHECK=true
【讨论】：
【参考方案12】： 将 "webpack": "4.44.2" 添加到package.json 的依赖项中。
创建.env 并输入SKIP_PREFLIGHT_CHECK=true
这将解决您的问题。
【讨论】：
【参考方案13】：从您的用户目录中删除 node_modules，即 C:\Users\User
【讨论】：
我已经尝试了上述所有方法，但我完全忘记了从 C:\Users\user 文件夹中删除我的节点模块。非常感谢@Emmanuel【参考方案14】：-
创建一个
.env 文件或编辑现有文件。
SKIP_PREFLIGHT_CHECK = true 将此写入 .env 文件。
重启开发服务器。
我这样解决了问题。
【讨论】：
【参考方案15】：将"webpack": "4.44.2" 行添加到package.json 文件的依赖项中。
创建.env文件，在里面输入SKIP_PREFLIGHT_CHECK=true，就可以解决你的问题了。
【讨论】：
这并不能解决问题，它是一种禁用预检检查的解决方法，可能会产生其他后果。【参考方案16】：要修复依赖关系树，请尝试按照以下步骤进行操作：
-
删除项目文件夹中的 package-lock.json（不是 package.json！）和/或 yarn.lock。
删除项目文件夹中的 node_modules。
从项目文件夹的 package.json 文件中的依赖项和/或 devDependencies 中删除“webpack”。
运行 npm install 或 yarn，具体取决于您使用的包管理器。
在大多数情况下，这应该足以解决问题。 如果这没有帮助，您可以尝试其他一些方法：
如果您使用 npm，请安装 yarn (http://yarnpkg.com/) 并使用它重复上述步骤。 这可能会有所帮助，因为 npm 已知包提升问题，这些问题可能会在未来的版本中得到解决。
检查 /home/omage/node_modules/webpack 是否在您的项目目录之外。 例如，您可能不小心在主文件夹中安装了一些东西。
尝试在您的项目文件夹中运行 npm ls webpack。 这将告诉您安装了 webpack 的其他包（除了预期的 react-scripts）。
如果没有其他帮助，请将 SKIP_PREFLIGHT_CHECK=true 添加到项目中的 .env 文件中。 如果您仍然想继续，这将永久禁用此预检检查。
回答修复依赖树
要解决依赖树问题，您必须从本地计算机中删除 node-modules 文件并运行 npm start 以启动 localhost
【讨论】：
【参考方案17】：就我而言，我从用户目录中删除了 node_modules。它奏效了。
【讨论】：
【参考方案18】：我已经坚持了一个多小时。我遵循列出的每一步。
我从我的项目中删除了 node_modules，并在我的 mac 上找到了所有节点模块文件夹。
然后我删除了 packagelock，然后运行 npm install，这给了我一个新的 nm 和 packagelock。
运行npm start 不断给我同样的错误。我知道这不是我的代码，因为我可以签出另一个分支并得到同样的错误。
这一切都是从我安装 react 测试库并将 react-scripts 从 2.1.1 升级到 4 开始的。. 我在运行一个关于 react-scripts 的测试后由于错误而升级（我不记得它到底说了什么。）
我已经用旧的 react-scripts 版本和没有测试库将我的 package.json 重置为旧的工作版本，再次执行上述所有步骤，但仍然有错误。
我在依赖项或开发依赖项中没有 webpack。
这是我以前工作的 package.json
"name": "bidrlfront",
"version": "1.0.0",
"private": true,
"homepage": "./",
"dependencies":
"@date-io/moment": "^1.3.13",
"@material-ui/core": "^4.12.3",
"@material-ui/icons": "^4.11.2",
"@material-ui/pickers": "^3.3.10",
"camelize": "^1.0.0",
"chart.js": "^2.7.3",
"classnames": "^2.2.6",
"cross-env": "^5.2.0",
"css-loader": "^1.0.0",
"dateformat": "^3.0.3",
"flux": "^3.1.3",
"lodash.find": "^4.6.0",
"moment": "^2.29.1",
"node-sass": "^4.14.1",
"react": "^16.14.0",
"react-bootstrap": "^1.6.1",
"react-dom": "^16.6.3",
"react-ga": "^2.5.6",
"react-loading": "^2.0.3",
"react-quill": "^1.3.3",
"react-router": "^4.3.1",
"react-router-dom": "^5.2.0",
"react-scripts": "2.1.1",
"shards-react": "^1.0.0",
"shortid": "^2.2.14"
,
"scripts":
"start": "react-scripts start",
"build:prod": "cross-env REACT_APP_BASENAME=/demo/shards-dashboard-lite-react REACT_APP_GAID=UA-115105611-1 npm run build",
"build": "cross-env REACT_APP_BASENAME=/demo/shards-dashboard-lite-react react-scripts build",
"test": "react-scripts test",
"scss": "node-sass --watch -include-path src/css -o css",
"eject": "react-scripts eject",
"gitty": "node g.js"
,
"eslintConfig":
"extends": "react-app"
,
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
],
"devDependencies":
"sass-loader": "^7.1.0"
,
"repository":
"type": "git",
"url": "git+ssh://git@bitbucket.org/rldev2/bidrl-app.git"
,
"keywords": [],
"author": "Stephanie Raymos <sraymos@rlliquidators.com>",
"license": "ISC"
当错误开始发生时，这是我的 package.json
"name": "bidrlfront",
"version": "1.0.0",
"private": true,
"homepage": "./",
"dependencies":
"@date-io/moment": "^1.3.13",
"@material-ui/core": "^4.12.3",
"@material-ui/icons": "^4.11.2",
"@material-ui/pickers": "^3.3.10",
"@testing-library/jest-dom": "^5.14.1",
"@testing-library/react": "^12.0.0",
"@testing-library/user-event": "^13.2.1",
"camelize": "^1.0.0",
"chart.js": "^2.7.3",
"classnames": "^2.2.6",
"cross-env": "^5.2.0",
"css-loader": "^1.0.0",
"dateformat": "^3.0.3",
"flux": "^3.1.3",
"lodash.find": "^4.6.0",
"moment": "^2.29.1",
"node-sass": "^4.14.1",
"react": "^16.14.0",
"react-bootstrap": "^1.6.1",
"react-dom": "^16.6.3",
"react-ga": "^2.5.6",
"react-loading": "^2.0.3",
"react-quill": "^1.3.3",
"react-router": "^4.3.1",
"react-router-dom": "^5.2.0",
"react-scripts": "^2.1.1",
"shards-react": "^1.0.0",
"shortid": "^2.2.14"
,
"scripts":
"start": "react-scripts start",
"build:prod": "cross-env REACT_APP_BASENAME=/demo/shards-dashboard-lite-react REACT_APP_GAID=UA-115105611-1 npm run build",
"build": "cross-env REACT_APP_BASENAME=/demo/shards-dashboard-lite-react react-scripts build",
"test": "react-scripts test",
"scss": "node-sass --watch -include-path src/css -o css",
"eject": "react-scripts eject",
"gitty": "node g.js"
,
"eslintConfig":
"extends": "react-app"
,
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
],
"devDependencies":
"sass-loader": "^7.1.0"
,
"repository":
"type": "git",
"url": "git+ssh://git@bitbucket.org/rldev2/bidrl-app.git"
,
"keywords": [],
"author": "Stephanie Raymos <sraymos@rlliquidators.com>",
"license": "ISC"
在发生错误之前，我还全局安装了测试库和 fsevents，但卸载了这些并删除了我的 mac 上的文件夹。
我在安装测试库后尝试运行我的应用程序时收到此错误后安装了 fsevents：
错误：fsevents不可用（这个watcher只能在Darwin上使用）
我得到一个空白屏幕。这解决了这个问题。
然后我的身份验证系统出现错误记录。
我正在使用 rxjs。我不得不安装它。
收到 react-scripts 错误并将其更新到最新版本。
就在那时，一切都破裂了。
当我运行npm ls webpack 时，我得到了这个：
├─┬ css-loader@1.0.1
│ └─┬ webpack@4.46.0
│ └─┬ terser-webpack-plugin@1.4.5
│ └── webpack@4.46.0 deduped
├─┬ react-scripts@2.1.1
│ ├─┬ babel-loader@8.0.4
│ │ └── webpack@4.46.0 deduped
│ ├─┬ css-loader@1.0.0
│ │ └── webpack@4.19.1 deduped
│ ├─┬ eslint-loader@2.1.1
│ │ └── webpack@4.46.0 deduped
│ ├─┬ file-loader@2.0.0
│ │ └── webpack@4.46.0 deduped
│ ├─┬ fork-ts-checker-webpack-plugin-alt@0.4.14
│ │ └── webpack@4.46.0 deduped
│ ├─┬ html-webpack-plugin@4.0.0-alpha.2
│ │ └── webpack@4.46.0 deduped
│ ├─┬ mini-css-extract-plugin@0.4.3
│ │ └── webpack@4.46.0 deduped
│ ├─┬ optimize-css-assets-webpack-plugin@5.0.1
│ │ └── webpack@4.46.0 deduped
│ ├─┬ sass-loader@7.1.0
│ │ └── webpack@4.19.1 deduped
│ ├─┬ terser-webpack-plugin@1.1.0
│ │ └── webpack@4.46.0 deduped
│ ├─┬ url-loader@1.1.1
│ │ └── webpack@4.46.0 deduped
│ ├─┬ webpack-dev-server@3.1.9
│ │ ├─┬ webpack-dev-middleware@3.4.0
│ │ │ └── webpack@4.46.0 deduped
│ │ └── webpack@4.46.0 deduped
│ ├─┬ webpack-manifest-plugin@2.0.4
│ │ └── webpack@4.46.0 deduped
│ ├─┬ webpack@4.19.1
│ │ └─┬ uglifyjs-webpack-plugin@1.3.0
│ │ └── webpack@4.46.0 deduped
│ └─┬ workbox-webpack-plugin@3.6.3
│ └── webpack@4.46.0 deduped
└─┬ sass-loader@7.3.1
└── webpack@4.46.0 deduped
【讨论】：
【参考方案19】：创建一个 .env 文件并将这一行放入“SKIP_PREFLIGHT_CHECK=true”
example
【讨论】：
正如目前所写，您的答案尚不清楚。请edit 添加其他详细信息，以帮助其他人了解这如何解决所提出的问题。你可以找到更多关于如何写好答案的信息in the help center。以上是关于NPM 启动返回错误，“项目依赖树可能有问题”的主要内容，如果未能解决你的问题，请参考以下文章
无法 npm 使用 eslint 依赖项启动我的 React 项目
npm 启动我的 Angular2 项目时出现重复的标识符导出错误
vue启动项目时出现的错误Error: Cannot find module 'D:\node_modules\npm\bin\npm-cli.js'