在 GitHub 上面找了幾個項目,下載下來想執(zhí)行以下,首先根據(jù) README 文檔進行安裝依賴:
npm install
但接下來就一直報錯,報錯信息如下:
npm ERR! code 1
npm ERR! path G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\node-sass
npm ERR! command failed
npm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c node scripts/build.js
npm ERR! Building: F:\nodejs\node.exe G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\node-gyp\bin\node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp verb cli [
npm ERR! gyp verb cli 'F:\\nodejs\\node.exe',
npm ERR! gyp verb cli 'G:\\前端自學資料\\項目實例\\Vue 項目\\vue2-douban-market-master\\node_modules\\node-gyp\\bin\\node-gyp.js',
npm ERR! gyp verb cli 'rebuild',
npm ERR! gyp verb cli '--verbose',
npm ERR! gyp verb cli '--libsass_ext=',
npm ERR! gyp verb cli '--libsass_cflags=',
npm ERR! gyp verb cli '--libsass_ldflags=',
npm ERR! gyp verb cli '--libsass_library='
npm ERR! gyp verb cli ]
npm ERR! gyp info using node-gyp@3.8.0
npm ERR! gyp info using node@18.12.1 | win32 | x64
npm ERR! gyp verb command rebuild []
npm ERR! gyp verb command clean []
npm ERR! gyp verb clean removing "build" directory
npm ERR! gyp verb command configure []
npm ERR! gyp verb check python checking for Python executable "python2" in the PATH
npm ERR! gyp verb `which` failed Error: not found: python2
npm ERR! gyp verb `which` failed at getNotFoundError (G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:13:12)
npm ERR! gyp verb `which` failed at F (G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:68:19)
npm ERR! gyp verb `which` failed at E (G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:80:29)
npm ERR! gyp verb `which` failed at G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:89:16
npm ERR! gyp verb `which` failed at G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\isexe\index.js:42:5
npm ERR! gyp verb `which` failed at G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\isexe\windows.js:36:5
npm ERR! gyp verb `which` failed at FSReqCallback.oncomplete (node:fs:207:21)
npm ERR! gyp verb `which` failed python2 Error: not found: python2
npm ERR! gyp verb `which` failed at getNotFoundError (G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:13:12)
npm ERR! gyp verb `which` failed at F (G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:68:19)
npm ERR! gyp verb `which` failed at E (G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:80:29)
npm ERR! gyp verb `which` failed at G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:89:16
npm ERR! gyp verb `which` failed at G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\isexe\index.js:42:5
npm ERR! gyp verb `which` failed at G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\isexe\windows.js:36:5
npm ERR! gyp verb `which` failed at FSReqCallback.oncomplete (node:fs:207:21) {
npm ERR! gyp verb `which` failed code: 'ENOENT'
npm ERR! gyp verb `which` failed }
npm ERR! gyp verb check python checking for Python executable "python" in the PATH
npm ERR! gyp verb `which` succeeded python C:\Users\asus\AppData\Local\Programs\Python\Python38\python.EXE
npm ERR! gyp ERR! configure error
npm ERR! gyp ERR! stack Error: Command failed: C:\Users\asus\AppData\Local\Programs\Python\Python38\python.EXE -c import sys; print "%s.%s.%s" % sys.version_info[:3];
npm ERR! gyp ERR! stack File "<string>", line 1
npm ERR! gyp ERR! stack import sys; print "%s.%s.%s" % sys.version_info[:3];
npm ERR! gyp ERR! stack ^
npm ERR! gyp ERR! stack SyntaxError: invalid syntax
npm ERR! gyp ERR! stack
npm ERR! gyp ERR! stack at ChildProcess.exithandler (node:child_process:412:12)
npm ERR! gyp ERR! stack at ChildProcess.emit (node:events:513:28)
npm ERR! gyp ERR! stack at maybeClose (node:internal/child_process:1091:16)
npm ERR! gyp ERR! stack at ChildProcess._handle.onexit (node:internal/child_process:302:5)
npm ERR! gyp ERR! System Windows_NT 10.0.18363
npm ERR! gyp ERR! command "F:\\nodejs\\node.exe" "G:\\前端自學資料\\項目實例\\Vue 項目\\vue2-douban-market-master\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
npm ERR! gyp ERR! cwd G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\node-sass
npm ERR! gyp ERR! node -v v18.12.1
npm ERR! gyp ERR! node-gyp -v v3.8.0
npm ERR! gyp ERR! not ok
npm ERR! Build failed with error code: 1
npm ERR! A complete log of this run can be found in:
npm ERR! F:\nodejs\node_cache\_logs\2023-04-02T15_28_50_593Z-debug-0.log
搜尋了好多種解決方法,依然不行,最后看到一篇博客說是?C盤 User 文件夾中的??.npmrc 文件的問題,于是我嘗試刪除該文件,再次進行?npm install ,此時報錯信息開始發(fā)生變化:
npm notice
npm notice New major version of npm available! 8.19.2 -> 9.6.3
npm notice Changelog: https://github.com/npm/cli/releases/tag/v9.6.3
npm notice Run npm install -g npm@9.6.3 to update!
npm notice
npm ERR! code 1
npm ERR! path G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\node-sass
npm ERR! command failed
npm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c node scripts/build.js
npm ERR! Building: F:\nodejs\node.exe G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\node-gyp\bin\node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp verb cli [
npm ERR! gyp verb cli 'F:\\nodejs\\node.exe',
npm ERR! gyp verb cli 'G:\\前端自學資料\\項目實例\\Vue 項目\\vue2-douban-market-master\\node_modules\\node-gyp\\bin\\node-gyp.js',
npm ERR! gyp verb cli 'rebuild',
npm ERR! gyp verb cli '--verbose',
npm ERR! gyp verb cli '--libsass_ext=',
npm ERR! gyp verb cli '--libsass_cflags=',
npm ERR! gyp verb cli '--libsass_ldflags=',
npm ERR! gyp verb cli '--libsass_library='
npm ERR! gyp verb cli ]
npm ERR! gyp info using node-gyp@3.8.0
npm ERR! gyp info using node@18.12.1 | win32 | x64
npm ERR! gyp verb command rebuild []
npm ERR! gyp verb command clean []
npm ERR! gyp verb clean removing "build" directory
npm ERR! gyp verb command configure []
npm ERR! gyp verb check python checking for Python executable "python2" in the PATH
npm ERR! gyp verb `which` failed Error: not found: python2
npm ERR! gyp verb `which` failed at getNotFoundError (G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:13:12)
npm ERR! gyp verb `which` failed at F (G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:68:19)
npm ERR! gyp verb `which` failed at E (G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:80:29)
npm ERR! gyp verb `which` failed at G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:89:16
npm ERR! gyp verb `which` failed at G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\isexe\index.js:42:5
npm ERR! gyp verb `which` failed at G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\isexe\windows.js:36:5
npm ERR! gyp verb `which` failed at FSReqCallback.oncomplete (node:fs:207:21)
npm ERR! gyp verb `which` failed python2 Error: not found: python2
npm ERR! gyp verb `which` failed at getNotFoundError (G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:13:12)
npm ERR! gyp verb `which` failed at F (G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:68:19)
npm ERR! gyp verb `which` failed at E (G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:80:29)
npm ERR! gyp verb `which` failed at G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\which\which.js:89:16
npm ERR! gyp verb `which` failed at G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\isexe\windows.js:36:5
npm ERR! gyp verb `which` failed at FSReqCallback.oncomplete (node:fs:207:21) {
npm ERR! gyp verb `which` failed code: 'ENOENT'
npm ERR! gyp verb `which` failed }
npm ERR! gyp verb check python checking for Python executable "python" in the PATH
npm ERR! gyp verb `which` succeeded python C:\Users\asus\AppData\Local\Programs\Python\Python38\python.EXE
npm ERR! gyp ERR! configure error
npm ERR! gyp ERR! stack Error: Command failed: C:\Users\asus\AppData\Local\Programs\Python\Python38\python.EXE -c import sys; print "%s.%s.%s" % sys.version_info[:3];
npm ERR! gyp ERR! stack import sys; print "%s.%s.%s" % sys.version_info[:3];
npm ERR! gyp ERR! stack ^
npm ERR! gyp ERR! stack SyntaxError: invalid syntax
npm ERR! gyp ERR! stack
npm ERR! gyp ERR! stack at ChildProcess.exithandler (node:child_process:412:12)
npm ERR! gyp ERR! stack at ChildProcess.emit (node:events:513:28)
npm ERR! gyp ERR! stack at maybeClose (node:internal/child_process:1091:16)
npm ERR! gyp ERR! stack at ChildProcess._handle.onexit (node:internal/child_process:302:5)
npm ERR! gyp ERR! System Windows_NT 10.0.18363
npm ERR! gyp ERR! command "F:\\nodejs\\node.exe" "G:\\前端自學資料\\項目實例\\Vue 項目\\vue2-douban-market-master\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
npm ERR! gyp ERR! cwd G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\node_modules\node-sass
npm ERR! gyp ERR! node -v v18.12.1
npm ERR! gyp ERR! node-gyp -v v3.8.0
npm ERR! gyp ERR! not ok
npm ERR! Build failed with error code: 1
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\asus\AppData\Local\npm-cache\_logs\2023-04-03T02_52_37_898Z-debug-0.log
根據(jù)報錯信息提示,可能是需要將 npm 版本從?8.19.2 升到?9.6.3,于是我繼續(xù)執(zhí)行?npm install -g npm@9.6.3
而此時終于沒有報錯了,證明 npm install 成功了。
PS G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master> npm install -g npm@9.6.3
added 1 package, and audited 238 packages in 8s
18 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities
PS G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master>
以上我以為解決了 npm install 一直報錯的問題,但接下來,根據(jù) README 文檔要求,運行項目時又出現(xiàn)另一個問題:
PS G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master> npm run dev
>>
> node build/dev-server.js
node:internal/modules/cjs/loader:998
throw err;
^
Error: Cannot find module 'chalk'
Require stack:
- G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\build\check-versions.js
- G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\build\dev-server.js
at Module._resolveFilename (node:internal/modules/cjs/loader:995:15)
at Module._load (node:internal/modules/cjs/loader:841:27)
at Module.require (node:internal/modules/cjs/loader:1061:19)
at require (node:internal/modules/cjs/helpers:103:18)
at Object.<anonymous> (G:\前端自學資料\項目實例\Vue 項目\vue2-douban-market-master\build\check-versions.js:1:13)
at Module._compile (node:internal/modules/cjs/loader:1159:14)
at Module._extensions..js (node:internal/modules/cjs/loader:1213:10)
at Module.load (node:internal/modules/cjs/loader:1037:32)
at Module._load (node:internal/modules/cjs/loader:878:12)
at Module.require (node:internal/modules/cjs/loader:1061:19) {
code: 'MODULE_NOT_FOUND',
requireStack: [
'G:\\前端自學資料\\項目實例\\Vue 項目\\vue2-douban-market-master\\build\\check-versions.js',
'G:\\前端自學資料\\項目實例\\Vue 項目\\vue2-douban-market-master\\build\\dev-server.js'
]
}
Node.js v18.12.1
根據(jù)報錯信息,它要求安裝 ' chalk ',但我 npm install chalk ,又會報錯,報錯信息和第一次一樣,說到底,依賴就是沒安裝成功。有人說是?node-sass 的問題:
它是一個 native 包,默認情況下每個 node 版本都需要單獨的 node-sass,一般會從 github release 上下載,而我安裝的 node 版本是18.12.1 ,github release 沒有這個版本,所以會轉(zhuǎn)向本地構(gòu)建,本地構(gòu)建需要 windows build tools,簡單說就是需要安裝 visual studio 2019。安裝這個后你的環(huán)境變量里就可以使用 python 等命令,但是明顯你沒有,所以會報錯。
但我電腦上明明安裝了??visual studio 2019 ,不知道為什么還是報錯,根據(jù)我找到這個博主的解決方案:http://t.csdn.cn/TwEll
用兩種方法處理依賴:
方式一、替換依賴
卸載舊版本的 node-sass 和 sass-loader,安裝 sass 和 sass-loader,不再使用 node-sass
// 第一步:
npm uninstall sass-loader node-sass
// 第二步:
npm install sass-loader@8.0.2 sass@1.26.5 -D
方式二、安裝指定版本依賴
npm i node-sass@6.0.1 sass-loader@10.2.0
如果使用方法二之后報錯,可能是安裝過程中某些包丟失,嘗試以下方法解決:
npm rebuild node-sass
但我嘗試之后,又報出下面的錯誤
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: elm@2.0.1
npm ERR! Found: webpack@1.15.0
npm ERR! node_modules/webpack
npm ERR! ? dev webpack@"^1.13.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer webpack@"^4.36.0 || ^5.0.0" from sass-loader@10.2.0
npm ERR! node_modules/sass-loader
npm ERR! ? dev sass-loader@"10.2.0" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR!
npm ERR! For a full report see:
npm ERR! C:\Users\asus\AppData\Local\npm-cache\_logs\2023-04-03T08_07_16_823Z-eresolve-report.txtnpm ERR! A complete log of this run can be found in: C:\Users\asus\AppData\Local\npm-cache\_logs\2023-04-03T08_07_16_823Z-debug-0.log
新的問題又產(chǎn)生,沒辦法,再找解決方法:
根據(jù)其報錯提示,我們?nèi)?zhí)行 npm install --force? 或者? npm install?--legacy-peer-deps,
但。。。。。。好像一進行 npm install ,馬上又回到最初的那個報錯,死循環(huán)了,沒有找到關(guān)鍵問題,歸根結(jié)底還是依賴沒能安裝成功的緣故。最后,我又去翻看了一下?README 文檔,發(fā)現(xiàn)該項目是在 nodejs 6.10.0 下開發(fā)的:
而我使用的是 nodejs 18.12.1 版本,初步判斷就是由于我使用的版本太新,超出這個項目所需的要求,使得 npm 的包出現(xiàn)問題,一直報錯,而這里,我又看到 README 文檔 說建議使用 yarn 下載依賴,我果斷嘗試,最后完美解決了項目下載依賴并運行會報錯等系列問題?!舅哉f還是得注意 README 文檔的相關(guān)信息】
至于怎么解決 npm 包的問題導致無法加載依賴和運行項目 npm run dev 會報錯的問題,暫時認為需要換成對應的 node.js 版本,但頻繁換 node.js 版本也很不方便,這時可以使用?nvm,一個nodejs 版本管理工具!來進行版本是使用控制。
下面說說下載安裝 nvm 的步驟:
【寫在前面】首先要注意,先把電腦上的 nodejs 卸載干凈,否則后面會出現(xiàn)一些問題。?
1. 去官網(wǎng)下載并安裝:https://nvm.uihtm.com/
【注意】選擇 nvm 安裝路徑時文件夾名不要出現(xiàn)中文和空格
2. 以管理員身份運行并輸入 nvm ,出現(xiàn)下圖信息說明安裝成功
3.?nvm 命令
常見的 nvm 命令
1. nvm -v //?查看 nvm 版本
- nvm -version // 顯示?nvm 版本及其信息
2.?nvm list //顯示版本列表
- nvm list :顯示已安裝的版本(同 nvm list installed
- nvm list installed:顯示已安裝的版本
- nvm list available:顯示所有可以下載的版本
3. nvm install //安裝指定版本node.js
- nvm install 16.5.0:安裝 16.5.0 版本的 node.js
- nvm install latest:安裝最新版本
4. nvm use // 使用指定版本node
- nvm use 16.5.0: 切換到 16.5.0 版本的 node.js
- --lts // 自動切換到長期支持版本
- --lts=<LTS name> // 自動切換到指定名稱的 node 長期支持版本
5. nvm uninstall <version> // 卸載指定版本 node
- nvm uninstall 14.5.0:卸載到 14.5.0 版本的 node.js
- nvm uninstall --lts // 卸載長期支持版本的node
- nvm uninstall --lts=<LTS name> // 卸載一個指定名稱的長期支持版本的node
6. nvm --help?//顯示命令行幫助信息?
?【注】在運行 nvm install 的時候,有可能會出現(xiàn)無權(quán)限安裝的問題,請以管理員身份運行?cmd?
其他的命令?
- nvm deactivate // 取消當前nvm命令行效果
1. nvm 查看 node 版本
- nvm current // 查看當前使用的 node 版本
- nvm ls // 查看所有本地可用的 node 版本
- nvm ls <version> // 參看指定版本
- nvm ls-remote // 查看所有可用遠程版本
- --lts // 查看所有長期支持版本
- nvm ls-remote <version> // 參看所有 node 的指定遠程版本
- --lts // 查看所有 node 長期支持版本
- --lts=<LTS name> // 僅查看指定名稱的長期支持版本
2. nvm 版本別名
- nvm alias [<pattern>]? // 顯示所有以 <pattern> 開頭的版本別名
- nvm alias <name> <version>? // 給版本 <version> 設置一個別名
- nvm unalias <name> // 刪除 <name> 的版本別名
3. nvm 和 npm
- nvm?install-latest-npm? // 在當前 node 版本中,將 npm 升級到最新版
- nvm?reinstall-packages <version>? // 在全局重新安裝 npm,從 <version> 版本到當前版本
4. npm which 顯示安裝路徑
npm?which?[current | <version>]? // 顯示已安裝 node?的安裝路徑。
5. nvm緩存
- nvm?cache?dir? // 顯示 nvm 的緩存目錄
- nvm?cache?clear // 清除?nvm 的緩存目錄
6. nvm 運行 node
- nvm exec [--silent] [version] [<command>]? // 在<version> 運行命令 <command>
- nvm exec 4.8.3 node app.js? // Run `node app.js` with the PATH pointing to node 4.8.3
- nvm run [--silent] [version] [<args>]? // 在<version>以參數(shù)<args>運行node --
- nvm run 6.10.3 app.js //Run app.js using node 6.10.3
7. 設置鏡像
- nvm node_mirror [url] :設置 node 鏡像。默認是 https://nodejs.org/dist/。如果不寫 url,則使用默認 url。設置后可至安裝目錄 settings.txt 文件查看,也可直接在該文件操作。
- nvm npm_mirror [url] :設置 npm 鏡像。https://github.com/npm/cli/archive/。如果不寫 url,則使用默認 url。設置后可至安裝目錄 settings.txt 文件查看,也可直接在該文件操作。
8. 版本管理
nvm on
?:開啟 node.js 版本管理。nvm off
?:關(guān)閉 node.js 版本管理。
?參考文章:
http://t.csdn.cn/K7Fad文章來源:http://www.zghlxwxcb.cn/news/detail-432276.html
?文章來源地址http://www.zghlxwxcb.cn/news/detail-432276.html
到了這里,關(guān)于【解決問題】Vue 項目中安裝依賴 npm install 一直報錯的文章就介紹完了。如果您還想了解更多內(nèi)容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!