Pinia does not initialize in project with inertiajs, vue and adonisjs.
I tried a few different ways, but inertiajs doesn't activate pinia. And when I try to access the stores, the error is shown in the console stating that the pinia is not yet active.
Note: Pinia is installed.
I tried in different ways, but I can't understand. And it's been a few days.
Any ideas that might help resolve this issue?
grateful for the attention.
app.js
import { createApp, h } from 'vue'
import { createInertiaApp } from '@inertiajs/vue3'
import {createPinia} from "pinia";
const pina = createPinia()
import DefaultLayout from './Layouts/DefaultLayout.vue'
createInertiaApp({
resolve: (name) => {
const page = require(`./Pages/${name}`).default
if (!page.layout) {
page.layout = DefaultLayout
}
return page
},
setup({ el, App, props, plugin }) {
createApp({ render: () => h(App, props) })
.use(pina)
.use(plugin)
.mount(el)
},
}).then()
Home.vue
<script lang="ts" setup>
import { useCounterStore } from '../Stores/counter'
const store = useCounterStore()
console.log(store)
</script>
<template>
<div>oi</div>
</template>
<style scoped>
</style>
counter.ts
import { defineStore } from 'pinia'
export const useCounterStore = defineStore('counter', {
state: () => ({ count: 0, name: 'Eduardo' }),
getters: {
doubleCount: (state) => state.count * 2,
},
actions: {
increment() {
this.count++
},
},
})
Error: [🍍]: "getActivePinia()" was called but there was no active Pinia. Did you forget to install pinia?
I managed to resolve. The store file must be js and not ts. Thank you for your attention.
counter.js