当前位置: 首页 > news >正文

解决pnpm中的 Pinia 版本冲突:Cannot read properties of undefined (reading ‘_s‘)

1. 问题现象

Vue3 + Pinia + PNPM + Vite 工程中,应用本身依赖 pinia,同时内部私有组件库(web-sdk)也依赖 pinia
运行时浏览器控制台抛出:

Uncaught TypeError: Cannot read properties of undefined (reading '_s')
at useStore (pinia.mjs:42:15)

2. 根因分析

PNPM 会把 同一个包 + 相同版本 + 相同 peer 依赖解析结果 合并到同一目录。
只要 三方包中的peer 依赖(typescript / vue)版本不一致,即使主版本号相同,也会被判定为 “不同解析结果”,用pinia2.0.36版本为例,因为pinia 2.0.36中依赖了vue和typescript和@vue/composition-api,其中typescript和composition-api是可选的

"peerDependencies": {"@vue/composition-api": "^1.4.0","typescript": ">=4.4.4","vue": "^2.6.14 || ^3.2.0"
}, 
"peerDependenciesMeta": {"typescript": {"optional": true},"@vue/composition-api": {"optional": true}},  

所以应用和组件库中的vue版本不同的话,就会生成两份物理副本,造成最终dist文件中存在2份pinia文件:

node_modules/.pnpm/
├─ pinia@2.0.36_vue@3.4.21_typescript@5.3.3/
└─ pinia@2.0.36_vue@3.5.13_typescript@5.8.2/

3. 解决方案

方案思路适用场景实施成本
方案 1允许存在两份物理副本,但运行时强制指向同一模块无法统一 peer 依赖版本(如组件库已发布)
方案 2彻底统一 peer 依赖版本,让 PNPM 只保留一份能同时修改应用 + 组件库⭐⭐

3.1 方案 1:Vite dedupe 强制对齐

在 vite.config.ts 中声明:

import { defineConfig } from 'vite'export default defineConfig({resolve: {dedupe: ['pinia'], // 关键一行},
})

原理:
Vite 在解析 import ‘pinia’ 时,永远使用第一次遇到的副本,从而保证全局符号唯一。
无需改动任何 package.json,最快落地。

3.2 方案 2:统一 peer 依赖版本

盘点组件库 web-sdk 的 peerDependencies,在应用侧对齐版本
重新安装依赖:

rm -rf node_modules pnpm-lock.yaml
pnpm install

4 小结

关键词一句话总结
重复实例PNPM 因 peer 依赖版本不同生成多份 pinia,导致全局 _s 未定义
快速修复vite.resolve.dedupe: ['pinia'] 运行时强制对齐
根治手段统一应用与组件库的 vue + typescript 版本,让 PNPM 只保留一份
http://www.dtcms.com/a/390773.html

相关文章:

  • 说一说大模型后训练的流程
  • 【微实验】激光测径系列(三)
  • Vim 使用从入门到精通
  • 快速实现 Excel 表格转 SVG:Java 教程
  • [极客大挑战 2019]LoveSQL
  • Excel和WPS表格中选中全部空单元格并输入相同内容
  • 日志易制造业安全UEBA解决方案
  • Java 将 HTML 转换为 Excel:实用指南
  • MySQL索引篇---数据结构的选择
  • 【STM32 CubeMX + Keil】 中断、NVIC 、EXTI
  • BIGO一面面试总结
  • Ansible-fetch模块
  • DevExpress WPF中文教程:DataGrid - 服务器数据和大型数据源
  • Vue项目不同页面显示不同的title
  • NW820NW825美光固态闪存NW829NW832
  • aosp13/14/15/16如何实现窗口局部区域高斯模糊毛玻璃效果及Winscope原生重大bug发现
  • Java微服务架构设计模式精解
  • 设计模式面试之单例模式常问知识点
  • 深入解析 MySQL 元数据锁 (MDL) 与 SHOW PROCESSLIST 实战
  • 能不能写一个可以在linux使用的类nano编辑器
  • Rocky10 使用kubeadm部署K8s v1.34 一主两从
  • 深入理解Buffer:数据世界的“蓄水池“
  • 通义万相开源 Wan2.2-S2V-14B,实现图片+音频生成电影级数字人视频
  • windows c++环境 使用VScdoe配置opencv
  • JVM(四)-- 对象的实例化内存布局和直接内存
  • G1垃圾回收器的优势
  • 内存分配策略
  • Python采集Tik Tok视频详情,Tik TokAPI接口(json数据返回)
  • 实时通信技术大比拼:长轮询、短轮询、WebSocket 与 SSE 深度解析及实战指南
  • ICML 2025|图像如何与激光雷达对齐并互补?迈向协调的多模态3D全景分割