Mirazex / vuex-overlay

Vuex state monitoring tool (for Vue 3) - temporary alternative instead of vue-devtools (vuex functionality). If you want new features - add request in issues or create new pull-request

Vuex Overlay Tool

I like Vue, but latest release (Vue 3) is working only with new vue-devtools version and there is no Vuex at this moment. And I must to create a temporary solution for this problem - vuex-overlay-tool.

Vuex Overlay Tool plugin for Vue 3 provides monitoring of the state in the store with feature from vue-devtools time-travel.

Features

• overlay panel with Vuex store from your app
• mutations history
• state & getters overview
• time travel for mutations

Getting Started

Required

Vuex 4 & Vue 3

Install

$ npm install vuex-overlay-tools

# or
$ yarn add vuex-overlay-tools

Usage

Your application must have Vuex Store

Step 1 - Add VuexOverlay plugin to you application

import { createApp } from "vue";
import VuexOverlay from "vuex-overlay-tools"

import { store } from "./store" // path to vuex store
import App from "./App.vue"

createApp(App)
  .use(store) // required
  .use(VuexOverlay) // add plugin to your app
  .mount('#app')

Step 2 - Open panel with special button

Previews

State Overview

Getters Overview

Mutations History