From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Wed, 13 Jul 2022 10:11:04 +0000 (+0200)
Subject: docs: updated nuxt instructions
X-Git-Tag: @pinia/nuxt@0.3.0~6
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=3954aeba66ea749f0e21f3676c24f8ee94b3197d;p=thirdparty%2Fvuejs%2Fpinia.git

docs: updated nuxt instructions
---

diff --git a/packages/docs/ssr/nuxt.md b/packages/docs/ssr/nuxt.md
index d8c2156d..6237964a 100644
--- a/packages/docs/ssr/nuxt.md
+++ b/packages/docs/ssr/nuxt.md
@@ -1,15 +1,13 @@
 # Nuxt.js
 
-Using Pinia with [Nuxt.js](https://nuxtjs.org/) is easier since Nuxt takes care of a lot of things when it comes to _server side rendering_. For instance, **you don't need to care about serialization nor XSS attacks**.
+Using Pinia with [Nuxt.js](https://nuxtjs.org/) is easier since Nuxt takes care of a lot of things when it comes to _server side rendering_. For instance, **you don't need to care about serialization nor XSS attacks**. Pinia supports Nuxt Bridge and Nuxt 3, for bare Nuxt 2 support, [See below](#nuxt-2-without-bridge).
 
 ## Installation
 
-Make sure to install [`@nuxtjs/composition-api`](https://composition-api.nuxtjs.org/) alongside `pinia`:
-
 ```bash
-yarn add pinia @pinia/nuxt @nuxtjs/composition-api
+yarn add @pinia/nuxt
 # or with npm
-npm install pinia @pinia/nuxt @nuxtjs/composition-api
+npm install @pinia/nuxt
 ```
 
 We supply a _module_ to handle everything for you, you only need to add it to `buildModules` in your `nuxt.config.js` file:
@@ -19,9 +17,7 @@ We supply a _module_ to handle everything for you, you only need to add it to `b
 export default {
   // ... other options
   buildModules: [
-    // Nuxt 2 only:
-    // https://composition-api.nuxtjs.org/getting-started/setup#quick-start
-    '@nuxtjs/composition-api/module',
+    // ...
     '@pinia/nuxt',
   ],
 }
@@ -43,18 +39,28 @@ export default {
 }
 ```
 
-## Using Pinia alongside Vuex
+## Auto imports
 
-It is recommended to **avoid using both Pinia and Vuex** but if you need to use both, you need to tell pinia to not disable it:
+By default `@pinia/nuxt` exposes one single auto import: `usePinia()`, which is similar to `getActivePinia()` but works better with Nuxt. You can add auto imports to make your life easier:
 
 ```js
 // nuxt.config.js
 export default {
+  // ... other options
   buildModules: [
-    '@nuxtjs/composition-api/module',
-    ['@pinia/nuxt', { disableVuex: false }],
+    // ...
+    [
+      '@pinia/nuxt',
+      {
+        autoImports: [
+          // automatically imports `usePinia()`
+          'defineStore',
+          // automatically imports `usePinia()` as `usePiniaStore()`
+          ['defineStore', 'definePiniaStore'],
+        ],
+      },
+    ],
   ],
-  // ... other options
 }
 ```
 
@@ -72,3 +78,43 @@ If you are using TypeScript or have a `jsconfig.json`, you should also add the t
 ```
 
 This will also ensure you have autocompletion 😉 .
+
+## Nuxt 2 without bridge
+
+Pinia supports Nuxt 2 until `@pinia/nuxt` v0.1.9. Make sure to also install [`@nuxtjs/composition-api`](https://composition-api.nuxtjs.org/) alongside `pinia`:
+
+```bash
+yarn add pinia @pinia/nuxt @nuxtjs/composition-api
+# or with npm
+npm install pinia @pinia/nuxt @nuxtjs/composition-api
+```
+
+We supply a _module_ to handle everything for you, you only need to add it to `buildModules` in your `nuxt.config.js` file:
+
+```js
+// nuxt.config.js
+export default {
+  // ... other options
+  buildModules: [
+    // Nuxt 2 only:
+    // https://composition-api.nuxtjs.org/getting-started/setup#quick-start
+    '@nuxtjs/composition-api/module',
+    '@pinia/nuxt',
+  ],
+}
+```
+
+### Using Pinia alongside Vuex
+
+It is recommended to **avoid using both Pinia and Vuex** but if you need to use both, you need to tell pinia to not disable it:
+
+```js
+// nuxt.config.js
+export default {
+  buildModules: [
+    '@nuxtjs/composition-api/module',
+    ['@pinia/nuxt', { disableVuex: false }],
+  ],
+  // ... other options
+}
+```