Nuxt 3 - Async Middleware - No active Pinia #1212
Replies: 18 comments 3 replies
-
I have the same issue, need a fix asap.. |
Beta Was this translation helpful? Give feedback.
-
I thought I was the only one having this issue :/ |
Beta Was this translation helpful? Give feedback.
-
Bump, hoping for an answer/fix |
Beta Was this translation helpful? Give feedback.
-
awesome :) |
Beta Was this translation helpful? Give feedback.
-
Try to move the userStore const outside the middleware. |
Beta Was this translation helpful? Give feedback.
-
Also seem to be having this issue. I've tried using the Nuxt Context to provide the import { useUserStore } from '@/store';
export default defineNuxtRouteMiddleware(async () => {
const app = useNuxtApp();
const store = useUserStore(app.$pinia);
store.user = {};
}); I'm not sure if this is going to be possible as a result, unless Nuxt moves Middleware to load after Plugins (I can only assume they built it that way for a reason). For now, I've gotten Middleware to load after Plugins by defining dynamic Middleware inside a Plugin: import { useUserStore } from '@/store';
export default defineNuxtPlugin(nuxt => {
const store = useUserStore(nuxt.$pinia);
addRouteMiddleware('my-middleware', async () => {
// TODO:
}, { global: true });
}); |
Beta Was this translation helpful? Give feedback.
-
Is there any updates on this issue? I am still having the problem using RC 3. |
Beta Was this translation helpful? Give feedback.
-
Also having this issue, no fix in sight? |
Beta Was this translation helpful? Give feedback.
-
Is there any updates on this issue? |
Beta Was this translation helpful? Give feedback.
-
I think this is fixed? I was having this issue some time back, and I was just revisiting some older code from that time and it seems to work. Perhaps this fix is what changed: nuxt/framework#4645 My code puts a simple counter in a pinia store, and increments it in route middleware. This is using RC6
Server logs:
Client logs:
|
Beta Was this translation helpful? Give feedback.
-
RC6 not happened, but RC7 happened. |
Beta Was this translation helpful? Give feedback.
-
same here I have issue pinia in middleware. |
Beta Was this translation helpful? Give feedback.
-
I've set up an example of it working in RC9 https://stackblitz.com/edit/github-tc2xr9?file=pages%2Fsecret.vue,app.vue,middleware%2Falways-run.global.ts&theme=light thanks to @sxgrant |
Beta Was this translation helpful? Give feedback.
-
This seems to work but are we comfortable with the idea of instancing the store every single time a page is requested? If this is handled as a Singleton underneath the covers by pinia then we are probably good otherwise do we need a better way long term? |
Beta Was this translation helpful? Give feedback.
-
It was working up until i updated to 3.6.1 from 3.2.3, now we're back to square one it seems. |
Beta Was this translation helpful? Give feedback.
-
For anyone using composables with import { useSettingsStore } from '~/store/settings';
export const apiFetch = $fetch.create({
headers: {
plant: useSettingsStore().selectedPlant
},
}); Wrap your functions => import { useSettingsStore } from '~/store/settings';
export const apiFetch = (url, options) => $fetch.create({
headers: {
plant: useSettingsStore().selectedPlant
},
})(url, options); So composable functions will have access to the latest state in the store, and that any changes to the state are automatically reflected in the component. But this creates a new instance every time it is called, which can be expensive and also lead to unnecessary overhead and decreased performance. Use export const apiFetch = (url, options) => $fetch(url, {
...options,
headers: {
plant: useSettingsStore().selectedPlant,
....options.headers
},
}); There are no errors in older versions of |
Beta Was this translation helpful? Give feedback.
-
Reproduction
no reproduction link
Steps to reproduce the bug
Expected behavior
Pinia should load on async middleware too..
Actual behavior
getActivePinia was called with no active Pinia. Did you forget to install pinia? const pinia = createPinia() app.use(pinia) This will fail in production.
Using async middleware, pinia is not getting started.
Additional information
No response
Beta Was this translation helpful? Give feedback.
All reactions