devtools: Application fine but Dev Tools throwing uncaught TypeError (wrappedGetters)

The Vue JS application appears to be fine (fully functional and nothing in console) but when accessing the Vue tab in Chrome dev tools it throws the following error.

Please note the attached screenshot of the developer console:

screen shot 2017-03-15 at 11 59 40

Any assistance would be much appreciated. This appeared to be fine yesterday. I see there was an update just recently released (3.1.2 - March 15th 2017) according to the Chrome Web Store.

Note that I’m using a modularised vuex store (and i’m using store.registerModule).

Thanks,

Tom

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Reactions: 6
  • Comments: 26 (3 by maintainers)

Most upvoted comments

Hi. I had the same rawGetter is not a function message issue, but I noticed that was my fault. I was importing vuex’s actions and getters files in wrong way. I suppose no everyone make the same idiot mistake, but this information may help some people suffering the issue 😉

TL;DR

import * as actions from './actions';
import * as getters from './getters';

👇👇👇

import actions from './actions';
import getters from './getters';

store/index.js

...
import * as actions from './actions';  // <- This is a culprit! "* as" is not required!
import * as getters from './getters';  // <- This is a culprit! "* as" is not required!
import modules from './modules';
...

export default {
   modules,
   getters,
   actions,
   ...
};

store/actions.js, store/getters.js

// just returning an empty object, because I am using vuex modules
// so no root actions/getters are defined here.
export default {
};

Closing this since the culprit seems to have been found 🙂 If the error persists, please open a new issue with a repro

If you export getters like this:

export function myGetter (state) { ... }
export function otherGetter (state) { ... }

Then you should import them with import * as getters from './getters' so you get an object with all the functions that you can directly pass to the Store.

If no one else will have a problem anymore, than I’ll do a pull request on the example and replace it to not use *

In that case we need to use * In that file, you added, is something like import EVERITING from FILE cause the file can have 10 export functions. And you dont want to import them by one. And you shall be using * (everithing)

So no need to make pull request, the code in examples is very good, just only in that case.

Instead try not to import empty actions/getters. 😃

I think that the problem is in empty global actions/getters when using modules.

@tomeightyeight Yes, I am using a modularised vuex store with hot module replacement.

@ibarral

See documentation for this repo