React+Vite启动报错：@apollo_Client.js路径同内容异

错误信息 #

Use GraphQL at http://localhost:3001/graphql
[1] X [ERROR] Two output files share the same path but have different contents: node_modules\.vite\deps_temp\@apollo_Client.js
[1]
[1] C:\Users\judo2\Documents\dev\my-sites\mat-house\client\node_modules\esbuild\lib\main.js:1624
[1]   let error = new Error(`${text}${summary}`);
[1]               ^
[1]
[1] Error: Build failed with 1 error:
[1] error: Two output files share the same path but have different contents: node_modules\.vite\deps_temp\@apollo_Client.js       
[1]     at failureErrorWithLog (C:\Users\judo2\Documents\dev\my-sites\mat-house\client\node_modules\esbuild\lib\main.js:1624:15)  
[1]     at C:\Users\judo2\Documents\dev\my-sites\mat-house\client\node_modules\esbuild\lib\main.js:1266:28
[1]     at runOnEndCallbacks (C:\Users\judo2\Documents\dev\my-sites\mat-house\client\node_modules\esbuild\lib\main.js:1046:63)    
[1]     at buildResponseToResult (C:\Users\judo2\Documents\dev\my-sites\mat-house\client\node_modules\esbuild\lib\main.js:1264:7) 
[1]     at C:\Users\judo2\Documents\dev\my-sites\mat-house\client\node_modules\esbuild\lib\main.js:1377:14
[1]     at C:\Users\judo2\Documents\dev\my-sites\mat-house\client\node_modules\esbuild\lib\main.js:678:9
[1]     at handleIncomingPacket (C:\Users\judo2\Documents\dev\my-sites\mat-house\client\node_modules\esbuild\lib\main.js:775:9)   
[1]     at Socket.readFromStdout (C:\Users\judo2\Documents\dev\my-sites\mat-house\client\node_modules\esbuild\lib\main.js:644:7)  
[1]     at Socket.emit (node:events:527:28)
[1]     at addChunk (node:internal/streams/readable:315:12) {    
[1]   errors: [
[1]     {
[1]       detail: undefined,
[1]       id: '',
[1]       location: null,
[1]       notes: [],
[1]       pluginName: '',
[1]       text: 'Two output files share the same path but have different contents: node_modules\\.vite\\deps_temp\\@apollo_Client.js'
[1]     }
[1]   ],
[1]   warnings: []
[1] }

排查解决步骤 #

• 清除Vite缓存：直接删除项目根目录下的node_modules/.vite文件夹，重启开发服务器。缓存文件冲突是这类报错的常见诱因。
• 检查Apollo Client依赖：打开package.json，确认没有同时安装apollo-client（旧版包）和@apollo/client（新版包），如果有重复依赖，卸载其中一个，保留最新的@apollo/client。
• 重装依赖：删除node_modules文件夹和package-lock.json（或yarn.lock），执行npm install（或yarn install）重新拉取完整依赖，避免安装过程中出现文件损坏或版本冲突。
• 添加Vite优化配置：若上述方法无效，在vite.config.js中添加依赖优化规则，强制指定Apollo Client的打包入口：

  import { defineConfig } from 'vite'
  import react from '@vitejs/plugin-react'
  
  export default defineConfig({
    plugins: [react()],
    optimizeDeps: {
      include: ['@apollo/client'],
      exclude: ['apollo-client'] // 若存在旧版包则排除
    }
  })
  

• 统一导入路径：确保项目中所有导入Apollo Client的代码路径一致，比如不要同时混用@apollo/client和@apollo/client/core这类不同子路径的导入方式。

内容的提问来源于stack exchange，提问作者Stephen Scott Moore