npm安装包时如何解决依赖冲突

问题

当我们切换node版本时，其对应的npm版本也会发生变化，而不同版本的npm对于安装依赖，有着不同的行为依赖。开发过程中，当项目初始是基于node14开始的，后续需要基于Node16，切换到对应的node版本后，直接执行npm i，发现无法安装成功，有一下类似的依赖冲突错误。

如何理解上面的错误并针对性的修复呢？

看图中圈出来的部分，就是错误的原因。eslint-loader@4.0.2要求peer dependency 中 eslint的版本至少在6.0.0以上，而项目中安装的eslint是5.xx的。
那为什么同样的版本包，node 14可以安装成功，而node16却会报错呢？
因为在 npm 版本 7 及更高版本中，默认情况下，npm 会更严格地处理 peerDependencies，以确保依赖树中的 peerDependencies 版本兼容性。这可能导致某些依赖项无法安装，因为 npm 会尝试解决所有 peerDependencies 的冲突。而node14对应的npm 6，不强制peerDependencies 的兼容性。

解决方法

npm i --legacy-peer-deps

执行npm i --legacy-peer-deps 强制安装，跳过peerDependencies的兼容性
–legacy-peer-deps 选项会恢复到 npm 版本 6 的行为，即在安装依赖时不会强制解决 peerDependencies 的冲突。
这意味着 npm 会允许安装那些可能与现有 peerDependencies 版本不完全兼容的依赖项。

注意事项
1、潜在风险:
使用 --legacy-peer-deps 可能会导致依赖项之间的版本不兼容问题，从而引发运行时错误。
因此，在使用此选项之前，最好先检查项目的依赖项版本，并确保它们之间的兼容性。
2、替代方案:
如果可能，建议手动解决 peerDependencies 冲突，或者更新依赖项以确保它们之间的兼容性。
使用 npm ls 命令可以查看当前项目的依赖树，并识别潜在的冲突。

逐次检查冲突，安装对应版本

1、首先根据报错的原因，查找依赖树，查找可能存在的冲突。以上图为例，知道在安装eslint版本有冲突，所以执行以下命令npm ls eslint，查看当前项目中有哪些依赖，及潜在的冲突。

查看输出内容，发现和elsint-loader版本冲突，对应eslint-loader要求最低的eslint版本为"^6.0.0 || ^7.0.0"，而当前是eslint@5.16.0，所以这里有2个选择，1升级eslint到指定版本，2降低eslint-loader到可以支持5.16.0版本的eslint。至于如何选择，个人根据实际情况来。因为改了这个，可能会引起其他的版本冲突，这里也没有好的办法，只能一步一步来。
我这里先尝试更新了eslint到v6版本后，重新执行npm ls eslint后，发现又有了新的冲突

这里可以看到有些安装包依赖eslint v5版本，所以这里就又将eslint恢复到v5版本了，尝试安装到对应版本的eslint-loader以解决第一次的冲突。
2、查看指定包不同版本对应的依赖项，用以选用合适的版本。
首先执行npm view eslint-loader versions ，查看对应包已发布的所有版本

为了方便快速查看对应包的安装依赖项，这里写了一个脚本，用以输出对应包的devDependencies,dependencies以及peerDependencies。下面的脚本是针对windows下的powershell，如果是mac或者linux等，需修改脚本到对应的脚本命令。

# package-dependency.ps1

# 获取指定包的依赖关系和开发依赖关系
#  .\package-dependency.ps1 -PackageInfo eslint-loader@3.0.4

param (
    [Parameter(Mandatory = $true)]
    [string]$PackageInfo
)

# 解析包名和版本号
if ($PackageInfo -match '^(?<PackageName>[^@]+)@(?<Version>.+)$') {
    $PackageName = $matches['PackageName']
    $Version = $matches['Version']
}
else {
    Write-Output "Invalid input format. Please use 'packageName@version'."
    exit 1
}

# 检查是否传入了版本号
if ($Version) {
    # 获取指定版本的 dependencies, devDependencies 和 peerDependencies
    Write-Output "Version: $Version"
    
    # 获取并输出 dependencies
    $dependencies = npm view "$PackageName@$Version" dependencies
    Write-Output "Dependencies:"
    Write-Output $dependencies
    Write-Output "------------------------"
    
    # 获取并输出 devDependencies
    $devDependencies = npm view "$PackageName@$Version" devDependencies
    Write-Output "DevDependencies:"
    Write-Output $devDependencies
    Write-Output "------------------------"
    
    # 获取并输出 peerDependencies
    $peerDependencies = npm view "$PackageName@$Version" peerDependencies
    Write-Output "PeerDependencies:"
    Write-Output $peerDependencies
    Write-Output "------------------------"
}
else {
    # 获取指定包的所有版本并以 JSON 格式输出
    $versions = npm view $PackageName versions --json | ConvertFrom-Json

    # 遍历每个版本
    foreach ($version in $versions) {
        Write-Output "Version: $version"
        
        # 获取并输出 dependencies
        $dependencies = npm view "$PackageName@$version" dependencies
        Write-Output "Dependencies:"
        Write-Output $dependencies
        Write-Output "------------------------"
        
        # 获取并输出 devDependencies
        $devDependencies = npm view "$PackageName@$version" devDependencies
        Write-Output "DevDependencies:"
        Write-Output $devDependencies
        Write-Output "------------------------"
        
        # 获取并输出 peerDependencies
        $peerDependencies = npm view "$PackageName@$version" peerDependencies
        Write-Output "PeerDependencies:"
        Write-Output $peerDependencies
        Write-Output "------------------------"
    }
}

在当前目录下创建该脚本，首先根据发生冲突的eslint-loader版本，适当降低其版本，查看选择的版本，是否支持对应的eslint v5
powershell终端执行.\package-dependency.ps1 -PackageInfo eslint-loader@3.0.4命令，查看对应的依赖

根据输出，可以看到该版本的eslint-loader可以支持。所以修改package.json中eslint-loader版本为3.0.4，重新执行npm i。
如果发现继续安装以后，eslint安装不再报错，则该冲突已解决。如遇到新的冲突，根据以上步骤，逐步解决新的冲突。直到全部安装成功为止。