fix(nuxt): inject pinia after installing the plugin

vuejs · Oct 14, 2021 · 32dfdec · 32dfdec
1 parent 7dbc8e8
commit 32dfdec
Showing 1 changed file with 8 additions and 6 deletions.
diff --git a/packages/nuxt/templates/plugin.js b/packages/nuxt/templates/plugin.js
@@ -11,19 +11,21 @@ if (isVue2) {
  */
 const PiniaNuxtPlugin = (context, inject) => {
   const pinia = createPinia()
-  // add $pinia to the context
-  inject('pinia', pinia)
-  // to allow accessing pinia without the $
-  context.pinia = pinia
-
   if (isVue2) {
     // simulate new Vue({ pinia })
     context.app.pinia = pinia
   } else {
-    // TODO: does this work?
     context.app.use(pinia)
   }
 
+  // make sure to inject pinia after installing the plugin because in Nuxt 3, inject defines a non configurable getter
+  // on app.config.globalProperties
+  // add $pinia to the context
+  inject('pinia', pinia)
+  // to allow accessing pinia without the $
+  // TODO: remove this in deprecation
+  context.pinia = pinia
+
   setActivePinia(pinia)
 
   // add access to `$nuxt`