Vuex tab not showing in Chrome w/ version 6.0.0-beta.2

[ljcremer]

Version

6.0.0-beta.2

"vuex": "^4.0.0-beta.4"
"vue": "^3.0.0-rc.10",

Browser and OS info

Chrome 85.0.4183.83 / Windows 10

Steps to reproduce

Open Vue Devtools in Chrome browser

What is expected?

To see the Vuex tab in the Vue Devtools tab

What is actually happening?

Vuex is not showing at all

[yyx990803]

Vuex integration is WIP and not available in the beta channel yet.

[CMCDragonkai]

Is there a ETA for vuex 4 support?

[Adrek]

Is there a way to debug Vuex that we can use until Dev tools support is ready?

[izayl]

@Adrek this API createLogger can use to debug Vuex

you can find the example from Vuex repo

[infinity899]

Hey @izayl I've tried createLogger and it doesn't log anything for me:

import { createStore, createLogger } from 'vuex';
import products from './modules/products';
import navigator from './modules/navigator';
import configurator from './modules/configurator';

export default createStore({
modules: {
products,
navigator,
configurator,
plugins: [createLogger()],
},
});

[izayl]

@infinity899

import { createStore, createLogger } from 'vuex';
import products from './modules/products';
import navigator from './modules/navigator';
import configurator from './modules/configurator';

export default createStore({
	modules: {
		products,
		navigator,
		configurator,
-		plugins: [createLogger()],
	},
+	plugins: [createLogger()],
});

[infinity899]

@izayl lol I was blind, thanks for pointing it out. Btw how did you comment it like this? For code I've found only which lets me only small chunks thanks!

[maurer2]

You can use triple backticks (`) to format code listings: https://docs.github.com/en/free-pro-team@latest/github/writing-on-github/basic-writing-and-formatting-syntax#quoting-code

[infinity899]

You can use triple backticks (`) to format code listings: https://docs.github.com/en/free-pro-team@latest/github/writing-on-github/basic-writing-and-formatting-syntax#quoting-code

thank you
@maurer2 

[shayneo]

Any updates on timings or higher level plans for this?

I certainly understand and appreciate the desire to get things right on the major version bump, but at the same time this seems like a fairly high priority feature.

Lastly, I would be happy to help tackle some of the work if pointed in the right direction, I'm sure others in the community would help out as well if it's just a matter of resourcing.

Thanks 😄

[Akryum]

cc @kiaking

[xnextx]

Hello. The lack of vuex in devtools makes it very difficult to work comfortably. Is there any way to fix this?

[timsayshey]

🦗🦗🦗

[marcelruiter]

Is there any progress on this issue? It is very hard to debug and develop without the support of Vuex in devtools.

[sgallino]

I understand the difficulty of development such a tool, and appreciate all the work done. But it would be really helpful if someone of the team can say the status of this feature, and if it's something that will be coming soon (e.g. next couple of weeks), or if it's something that will take much longer to implement. That can help people (me included, of course) decide if implement Vuex in a new project, keep using it on a developing project, or ignore/remove it.

Implementing Vuex without this has really been a pain, and made me really regret using it in a recent project. While I will most likely drop it when I have a chance to make the necessary refactory (which will take lots of extra development time and effort), it has been a big time-consuming and frustration-inducing task, something I have never associated (or really experience) with Vue-related stuff.

This issue has been open since September, and besides Evan's response at the beginning, there haven't been any kind of update regarding the status of support.

The createLogger can alleviate this somewhat, but the amount of clutter added to the console is a lot, which makes it far less useful.

So, please, can we get an status update? Even if the response is something in the lines of "It's not coming anytime soon", that would be extremely helpful!

And last but not least, thank you so much for all the work done!

P.D.: Sorry for long post :)

[mgdodge]

I've been thinking about trying harlem (github here) as an alternative - initial impression is that it's vuex without actions, written specifically for vue3. And it has proper devtools support.

Perhaps that repo has some ideas that could help progress this issue along?

[shayneo]

@mgdodge Harlem looks nice! Thanks for sharing 🎉

Me and my team have actually decided to move away from Vuex, and will instead manage shared state using the Reactivity API. This is a pretty drastic shift for most folks/projects, but once the mental model clicked it became a "no brainer" for us.

I get the sense that the emphasis for shared state is moving towards Reactivity API and away from Vuex in the Vue ecosystem, which might explain the lack of Vuex support here.

Either way, the devtools beta plugin docs were just published, so that seems like a promising path.

[Akryum]

Let's continue discussing here.