Vuex support?

[talberkoSB]

Hi Im trying to use vuex in my micro-app, but cannot get it working.

Is there a way?

[joeldenning]

Hi @talberkoSB, apologies for the very slow response. VueX should work just fine with single-spa. If this is still an issue for you, could you provide more details, such as a stacktrace?

I'm closing this because the issue is so old, but feel free to reopen if you are still running into this problem.

[diegonc]

I've found the same problem when using Vuex, more concretely when devtools is activated. Here's[1] a repository with a minimal reproduction based on the coexisting-vue apps example.

Can you please have a look? Thanks

[1] https://github.com/diegonc/coexisting-vue-microfrontends

[joeldenning]

I'll put this in my queue to take a look at later. Thank you for providing a repo that demonstrates the problem

[joeldenning]

I was unable to reproduce any problems related to Vuex in your repo. What I did was go to coexisting-vue-microfrontends.surge.sh, add an override for app1, and then navigate back and forth between app1 and app2. I verified that app1 was being downloaded from localhost and that devtools was set to true in the vuex config.

I do not have the Vue devtools installed as a browser extension - perhaps that is the cause? Could you provide further detail about how to reproduce the error?

[diegonc]

Yes, the issue is with the devtools extension activated. I get this exception

app-errors.js:9 Uncaught app1: Application 'app1' died in status LOADING_SOURCE_CODE: t.isBuffer is not a function
    at y (<anonymous>:1:2232)
    at f (<anonymous>:1:3275)
    at Object.<anonymous> (<anonymous>:1:928)
    at Object.r (<anonymous>:1:375)
    at Object.emit (<anonymous>:1:694)
    at devtoolPlugin (webpack-internal:///./node_modules/vuex/dist/vuex.esm.js:62:15)
    at new Store (webpack-internal:///./node_modules/vuex/dist/vuex.esm.js:365:5)
    at eval (webpack-internal:///./src/store/index.js:8:13)
    at Module../src/store/index.js (http://localhost:8081/app.js:2529:1)
    at __webpack_require__ (http://localhost:8081/app.js:737:30)
    at fn (http://localhost:8081/app.js:111:20)
    at eval (webpack-internal:///./src/main.js:20:64)
    at Module../src/main.js (http://localhost:8081/app.js:2493:1)
    at __webpack_require__ (http://localhost:8081/app.js:737:30)
    at fn (http://localhost:8081/app.js:111:20)
    at Object.0 (http://localhost:8081/app.js:2578:18)
    at __webpack_require__ (http://localhost:8081/app.js:737:30)
    at http://localhost:8081/app.js:804:37
    at Object.<anonymous> (http://localhost:8081/app.js:807:10)
    at Object.execute (https://cdnjs.cloudflare.com/ajax/libs/systemjs/6.1.1/extras/amd.min.js:1:599)
    at Object.declaration.execute (https://cdnjs.cloudflare.com/ajax/libs/systemjs/6.1.1/extras/named-exports.js:42:19)
    at i (https://cdnjs.cloudflare.com/ajax/libs/systemjs/6.1.1/system.min.js:4:3906)
    at t (https://cdnjs.cloudflare.com/ajax/libs/systemjs/6.1.1/system.min.js:4:3875)
    at https://cdnjs.cloudflare.com/ajax/libs/systemjs/6.1.1/system.min.js:4:4097
    at async Promise.all (index 1)

When the devtools extension is disabled, there is no exception.

[joeldenning]

I installed these Vue devtools in Firefox and repeated my test. I saw no issues. See below where you can see it working:

I'm closing this since I'm unable to reproduce the error. Feel free to comment further with more steps on how to see the error.