vuex-pathify: Unable to expand wildcard path

After upgrading a working project from nuxt 1.4 to 2.5 I’m getting this error

[Vuex Pathify] Unable to expand wildcard path …:

The usual reason for this is that the router was set up before the store

Make sure the store is imported before the router, then reload

This is how I added pathify to the vuex plugins:

import pathify from 'vuex-pathify'
...
export const plugins = [
  createPersistedState({
    key: 'myapp',
    paths: ['session',]
  }),
  pathify.plugin,
]

I’m using nuxt in spa mode

About this issue

Original URL
State: open
Created 5 years ago
Comments: 22 (11 by maintainers)

Most upvoted comments

FYI, I found a really cool Chrome extension the other day called OctoLinker which adds live links to GitHub repos:

https://octolinker.github.io/

It’s great for this kind of thing!

davestewart on Mar 28, 2019

Another option would be moving all that code to a helper in the router folder, then you only need do:

import { isLoggingIn } from '@plugins/router'

const actions = {
  login () {
    if(!isLoggingIn()) {
      // your code
    }
  }
}

Because isLoggingIn() (or whatever you want to call it) is itself a function, it won’t reference the router until you use it, so won’t suffer the same order-of-import issues you were previously.

Also, if you are doing everything with the URL, there’s nothing to stop you parsing the URL directly with location.search

davestewart on Oct 14, 2019

Hi @VesterDe,

This is probably an order-of-import issue.

As soon as you import your router file, webpack will then try to import everything that is included in that file, so you end up with a race condition because suddenly your components are being imported before the store they depend on.

You’ll have to think of a way to allow the store to finish its setup before using the router, or at least the routes and the dependent components it depends on. Consider adding routes dynamically, lazy-loading of routes or something like this:

// helper
function router () {
  return require('/router').default
}

// use router in an action
const actions {
  doSomething () {
    router().whatever()
  }
}

Let me know how you get on 😃

davestewart on Oct 14, 2019

I’m trying to replicate it with a clean, new nuxt app.

arielnmz on Mar 26, 2019