While implementing the vue-facing decorator in my current project, I encountered an issue with setting up pinia.
The structure of my component resembles the example provided here:
I have verified that decorators like @Setup are functioning correctly, indicating the correct setup of vue-facing-decorator.
This is how I am attempting to set up pinia:
export const useCoreStore = defineStore('core', {
state: () => ({
navCollapsed: false,
}),
getters: {},
actions: {},
});
In the component:
import { useCoreStore } from '@/core';
import { mapActions } from "pinia";
@Component({
setup() {
const store = useCoreStore();
debugger;
return { useCoreStore: store };
},
methods: {
...mapActions(useCoreStore, [ "setNavCollapsed" ])
}
})
class AppHeader extends Vue {
Upon running this code in the browser, I encounter an error and it fails to reach the debugger, showing:
Uncaught ReferenceError: Cannot access 'useCoreStore' before initializationIf I disable the mapActions section:
//...mapActions(useCoreStore, [ "setNavCollapsed" ])
I can see the debugger being triggered.
What would be the correct approach for utilizing pinia with the vue-facing-decorator package?