Skip to content
目录

Devtools 集成

Pinia 通过 Vue DevTools 插件暴露 store 列表、state 树、时间旅行式编辑(依赖 DevTools 版本)、action 时间线。


1. 自动行为

app.use(pinia) 后,开发环境尝试注册 DevTools bridge;每个 store 以 id 显示。


2. 可见信息

信息说明
State当前 $state
Getters计算属性
Actions调用记录、参数(可配置)
$patch作为 mutation 展示

3. 生产环境

默认应关闭或剥离 DevTools 钩子;构建工具 tree-shake __DEV__ 分支。


4. 自定义

插件可发送自定义事件;深层集成读 devtoolsPlugin.ts(包内路径以版本为准)。


5. 总结

Devtools 是开发期观测面;与 Redux DevTools 类似,但贴合 Vue 组件树与 Pinia store id。

MIT License.