Yarn 3.5+Vite项目中PnP禁止导入React的问题求助

问题 #

用Yarn 3.5稳定版搭配Vite开发项目，执行yarn dev时，recoil-sync包报无法解析"react"的错误。Yarn PnP清单显示该包未将React列为依赖，官方建议把React标记为外部依赖，但这会导致React被排除在打包外，而项目必须依赖React运行，这个方案行不通。

项目核心配置如下：

• package.json：已安装react@18.2.0和recoil-sync@0.2.0
• .yarnrc.yml：启用PnP模式（nodeLinker: pnp）

解决方案 #

1. 用Yarn packageExtensions补全依赖 #

这是适配Yarn PnP的最优方案，手动给recoil-sync添加React依赖，让Yarn的依赖管理系统认可这个依赖关系：

编辑.yarnrc.yml，添加以下内容：

packageExtensions:
  "recoil-sync@*":
    dependencies:
      "react": "^18.0.0"

版本号可以和你项目中React的实际版本保持一致。

执行yarn install重新生成PnP清单，更新依赖链路。

2. 配置Vite强制解析React #

如果方法1没效果，可通过Vite配置指定React的解析路径，确保recoil-sync能找到React：

修改vite.config.ts：

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react-swc';

export default defineConfig({
  plugins: [react()],
  resolve: {
    alias: {
      'react': require.resolve('react'),
    },
  },
  optimizeDeps: {
    include: ['react', 'recoil-sync'],
  },
});

3. 升级recoil-sync版本 #

recoil-sync@0.2.0可能存在依赖声明遗漏的问题，尝试升级到最新版本：

yarn upgrade recoil-sync@latest

升级后执行yarn install更新依赖。

验证 #

完成配置修改后，重新运行yarn dev，确认recoil-sync的React解析错误已消除。

内容的提问来源于stack exchange，提问作者TugboatCaptain