目录
归档
33
2017 年 09 月 10 日
Chrome 扩展 VuexTree

github地址:https://github.com/zhw2590582/chrome-extension-vuexTree

一个Chrome扩展,为 Vuex 实现类似 redux-devtools-extension 的状态树展示效果

预览

来自 vue2-elm

使用

在 “Chrome => 选项 => 更多工具 => 扩展程序” 中勾选 “开发者模式”。

直接拖放 vuexTree.crx 到插件目录。

或者在 “加载已解压的扩展程序” 中载入 “vuexTree” 目录。

然后在 Vue 中,在 store 后面添加一个订阅消息即可。


import store from './store';

store.subscribe((mutation, state) => {
  window.__VUEXTREE_GLOBAL_HOOK__ && window.__VUEXTREE_GLOBAL_HOOK__({
    type: '@update',
    mutation,
    state
  });
})


开发


  //安装依赖
  $ npm install

  //开发模式:生成 'dev' 目录
  $ npm run dev

  //发布目录:生成 'vuexTree' 目录
  $ npm run build

  //发布crx:生成 'vuexTree.crx' 文件
  $ npm run crx


依赖

d3-state-visualizer

转载原创文章请注明,转载自: 老赵茶馆 » Chrome 扩展 VuexTree
留言
Loading...

发表评论

电子邮件地址不会被公开。 必填项已用*标注

  1. 喜帖街 谢安琪
  2. 猫の恩返 室内管弦楽団