pnpm时代包版本不一致问题还是否存在

结论：不会有版本问题

问题描述：

假设我们有一个项目 MyApp，该项目依赖两个包 PackageA 和 PackageB（这两个包是直接依赖），这两个包又有相同的间接依赖：

PackageA 依赖 PackageC@v1.0.0
PackageB 依赖 PackageC@v1.0.1

先说为什么npm会存在这个问题：

npm下载依赖的策略是"包提升"，所有的依赖，会直接下载到node_modules中，如果说出现同一个包不同版本的问题，会尝试下载一个中和版本，这样也就出现了版本问题。

pnpm为什么可以做到避免版本

这都是因为pnpm采用了"包隔离"的下载策略，看一下pnpm安装的依赖

可以看到，pnpm下载的第三方依赖文件夹下会有一个独立的node_modules目录，这样保证了每个第三方依赖，都有自己独立的依赖环境。

我们来创建一个项目验证这个问题

项目目录结构：

项目引用关系：

packageB --> packagec1.0.0

packageA --> packagec1.0.1

project

packageB

packageA

首先我将packageC发布到了npm上，包名：@caw-live/packagec 然后前后发布了两个版本：

1.0.0 该包代码：

js 复制代码

index.js
export const packageC = () => {
  console.log("packageC@v1.0.0");
};

1.0.1 该包代码：

js 复制代码

index.js
export const packageC = () => {
  console.log("packageC@v1.1");
};

然后packageA包和packageB包都使用pnpm安装packageC包

packageA下的代码：

js 复制代码

index.js
import { packageC } from "@caw-live/packagec";

export const packageA = () => {
  packageC();
};

packageB下的代码：

js 复制代码

index.js
import { packageC } from "@caw-live/packagec";

export const packageB = () => {
  packageC();
};

project项目使用pnpm link 安装 A和B包

project下的代码：

js 复制代码

import { packageA } from "packagea";
import { packageB } from "packageb";

packageA();
packageB();

运行一下：

打包测试生产环境 使用rollup进行打包

js 复制代码

import { nodeResolve } from '@rollup/plugin-node-resolve';

export default {
  input: 'index.js',
  output: [
    {
      file: 'dist/bundle.esm.js',
      format: 'es'
    },
  ],
  plugins: [
    nodeResolve({
      // 解析 node_modules 中的依赖
      preferBuiltins: false,
    }),
  ]
};

打包结果：

js 复制代码

const packageC$1 = () => {
  console.log("packageC@v1.0.1");
};

const packageA = () => {
  packageC$1();
};

const packageC = () => {
  console.log("packageC@v1.0.0");
};

const packageB = () => {
  packageC();
};

packageA();
packageB();

可以看到，1.0.0和1.0.1的代码，都被成功的打包进来了。

在给大家抛出一个问题，会的可以在评论区留言

package.json文件中记录的dependencies，devDependencies，是否会影响打包结果。

另外给朋友打个广告：

如果有想做学习基建ai项目的同学可以加v: CQ20190621

课程目录：

自研状态管理库（非redux，zustand，是自研）

基于antd组件库的二次开发

基于umi插件化基建工程

ai工作流项目