升级Craft CMS 5后执行npm run dev遇@vue/apollo-composable文件缺失错误

问题概述 #

接手的Craft CMS项目升级到Craft 5后，执行npm run dev构建时出现文件找不到错误：

🚨 Build failed.
[Error: ENOENT: no such file or directory, open '/Users/chris/ddev/project-name/node_modules/@vue/apollo-composable/src/useApolloClient.ts']

检查发现@vue/apollo-composable包内不存在src目录，且该错误是更新部分依赖后出现的，需在不回滚提交的前提下用新版本依赖解决。

解决方案 #

1. 升级@vue/apollo-composable至稳定正式版 #

当前使用的是4.0.0-beta.1测试版本，大概率存在包结构或内部导入的问题。直接安装最新稳定版：

npm install @vue/apollo-composable@latest --save

正式版的npm包只会包含编译后的成品文件，不会引用未发布的src目录内容。

2. 清理依赖缓存并重装 #

缓存可能导致依赖解析异常，执行以下步骤：

• 删除本地依赖和锁文件：

  rm -rf node_modules package-lock.json
  

• 重新安装依赖：

  npm install
  

• 清理Parcel构建缓存：

  rm -rf .parcel-cache
  

• 再次尝试构建：

  npm run dev
  

3. 排查依赖版本兼容性 #

检查核心依赖的版本匹配情况，确保@vue/apollo-composable、@apollo/client和vue版本兼容：

npm ls @vue/apollo-composable @apollo/client vue

如果存在嵌套依赖的旧版本冲突，可以通过package.json的resolutions字段强制统一版本：

"resolutions": {
  "@vue/apollo-composable": "^4.0.0"
}

4. 调整Parcel解析配置（可选） #

如果以上步骤无效，可能是Parcel尝试解析node_modules中的源码文件。可以在.parcelrc中调整解析规则，优先使用包的主入口文件（通常是编译后的dist文件）：

{
  "resolvers": ["@parcel/resolver-default"]
}

原因分析 #

• 测试版本的@vue/apollo-composable@4.0.0-beta.1可能存在打包疏漏，内部代码引用了未包含在npm发布包中的src目录文件；
• 之前项目能正常运行，可能是旧依赖树中存在兼容的嵌套版本，或当时的Parcel版本对这类错误有容错处理，更新依赖后结构变化导致问题暴露。

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