一、處理方案
- 這是因為"@types/react"、"@types/react-dom"在子依賴中使用的版本不一致導致,一般情況npm會自動幫我們處理版本不一致的問題。如果npm處理不了,就需要我們自己手動處理
- 在package.json中添加一項配置
{name:"test",version:"1.0.0",...,"devDependencies": {"@types/react": "17.0.0","@types/react-dom": "17.0.0"},"resolutions": {"@types/react": "17.0.0","@types/react-dom": "17.0.0"}, }
- 在package.json中的scripts中添加一行命令
{"scripts":{"preinstall": "npx force-resolutions"} }
- 配置完成之后要執行一次preinstall命令:npm run?preinstall 。如果執行命令后還是會有報錯,執行 npm i 安裝全部依賴,再次執行?npm run?preinstall
二、原因
以下內容引用自:package.json中的resolutions作用_package.json resolutions-CSDN博客
resolutions 是一個用于解決依賴項沖突的 npm 特殊字段。在某些情況下,您的項目依賴項可能需要不同的版本,而這些版本之間可能存在沖突。這時候,您可以使用 resolutions 字段來指定應該使用哪個版本,以解決這些沖突。
例如,如果您的項目依賴于 package-a 和 package-b,而這兩個包都依賴于 package-c,但它們依賴于 package-c 的不同版本,這會導致沖突。在這種情況下,您可以在 package.json 文件中使用 resolutions 字段來指定應該使用哪個版本。例如:
{"dependencies": {"package-a": "^1.0.0","package-b": "^2.0.0"},"resolutions": {"package-c": "^1.2.0"}
}
在這個示例中,我們指定了 package-c 的版本應該是 ^1.2.0。這意味著當 npm 安裝依賴項時,它將使用 1.2.x 系列中的最新版本來解決 package-a 和 package-b 之間的沖突。
需要注意的是,resolutions 字段只在您的項目依賴項中出現沖突時才需要使用。在大多數情況下,npm 可以自動解決依賴項之間的沖突,而無需使用 resolutions 字段。
當某些安全掃描工具(例如fossa)掃描出項目依賴的子依賴版本需要升級的情況,也可以嘗試使用此方法來解決。
在package.json文件里添加跟scripts、dependencies、evDependencies平級的resolutions,把想要強制升級的子依賴期望版本寫入,scripts里添加配置"preinstall": "npx force-resolutions",最后像啟動項目一樣使用npm run preinstall運行下載,最后達成目的。
{"name": "xxx","version": "1.0.0","description": "xxx","author": "xxx","private": true,"scripts": {"dev": "webpack-dev-server --inline --hot --progress --config build/webpack.dev.conf.js","start": "npm run dev","unit": "jest --config test/unit/jest.conf.js --coverage","e2e": "node test/e2e/runner.js","test": "npm run unit && npm run e2e","build": "node build/build.js","preinstall": "npx force-resolutions"},"dependencies": {"@types/echarts": "0.0.13","ajv": "^6.12.6","awe-dnd": "^0.3.4","axios": "^0.26.0","babel-polyfill": "^6.26.0"},"devDependencies": {"vue-template-compiler": "^2.6.11","webpack": "^3.12.0","webpack-bundle-analyzer": "^2.13.1","webpack-merge": "^4.2.2"},"resolutions": {"lodash.template": "4.5.0","eventsource": "1.1.1","ms":"https://registry.npmjs.org/ms/-/ms-2.1.3.tgz"},"engines": {"node": ">= 12.0.0","npm": ">= 3.0.0"},"browserslist": ["> 1%","last 2 versions","not ie <= 8"]
}