Vuex in RPGjs

zziz

Hello.

Is it possible to add Vuex to custom module? Or is this something you need to add to framework?

Samarium

Hello and welcome to the community,

I think you can add Vuex, in the module (client side)

import { RpgClientEngine, RpgClientEngineHooks } from '@rpgjs/client'
import { createStore } from 'vuex'

const store = createStore({
  state () {
    return {
      count: 0
    }
  },
  mutations: {
    increment (state) {
      state.count++
    }
  }
})

// use engine in @RpgModule
export const engine: RpgClientEngineHooks = {
    onStart(engine: RpgClientEngine) {
         const { vueApp } = engine
         vueApp.use(store)
    }
}

zziz

Hi, thanks for answer. Will try it now

zziz

Hmm, it seems I dont understand... I have imported title-screen module.. I want to add your code to title-screen/client/index.ts but I am not sure how to edit code (first time using vue 😅 ). Or I need to add somewhere else?

zziz

Okay, I looked in other files and found answer to my question...

I created new file store.ts, added code @Samarium provided, then edited index.ts as follow:

Added import { engine } from "./store"

Then added "engine" to RpgModule

@RpgModule<RpgClient>({
engine,
    sprite,
    gui: [
        titleGui,
        loginGui
    ]
})

Is this the right approach?

Samarium

zziz

That's it.