]> git.ipfire.org Git - thirdparty/vuejs/pinia.git/commitdiff
fix(nuxt): use srcDir by default for storeDirs
authorEduardo San Martin Morote <posva13@gmail.com>
Mon, 16 Oct 2023 09:46:35 +0000 (11:46 +0200)
committerEduardo San Martin Morote <posva13@gmail.com>
Mon, 16 Oct 2023 09:46:35 +0000 (11:46 +0200)
Fix #2447

packages/docs/cookbook/hot-module-replacement.md
packages/docs/ssr/nuxt.md
packages/nuxt/src/module.ts

index 0f32c675ba3f7adecfac3078273f4c4bd9340be9..37bce74d0b6621c2bd752b787107d646a6f07872 100644 (file)
@@ -9,7 +9,7 @@ You need to add this snippet of code next to any store declaration. Let's say yo
 // auth.js
 import { defineStore, acceptHMRUpdate } from 'pinia'
 
-const useAuth = defineStore('auth', {
+export const useAuth = defineStore('auth', {
   // options...
 })
 
index 946e20fb604ad0c6179e8314dba49b162eb45af4..6d73bb0a461e18b54cb9d997ad64ea713a6685db 100644 (file)
@@ -61,23 +61,27 @@ const { data } = await useAsyncData('user', () => store.fetchUser())
 
 ## Auto imports
 
-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:
+By default `@pinia/nuxt` exposes a few auto imports:
 
-```js
-// nuxt.config.js
+- `usePinia()`, which is similar to `getActivePinia()` but works better with Nuxt. You can add auto imports to make your life easier:
+- `defineStore()`
+- `acceptHMRUpdate()` for [hot module replacement](../cookbook/hot-module-replacement.md)
+
+It also automatically imports **all stores** defined withing your `stores` folder. It doesn't lookup for nested stores though. You can customize this behavior by setting the `storeDirs` option:
+
+```ts
+// nuxt.config.ts
 export default defineNuxtConfig({
   // ... other options
   modules: ['@pinia/nuxt'],
   pinia: {
-    autoImports: [
-      // automatically imports `defineStore`
-      'defineStore', // import { defineStore } from 'pinia'
-      ['defineStore', 'definePiniaStore'], // import { defineStore as definePiniaStore } from 'pinia'
-    ],
+    storeDirs: ['./stores/**', './custom-folder/stores/**'],
   },
 })
 ```
 
+Note the folders are relative to the root of your project. If you change the `srcDir` option, you need to adapt the paths accordingly.
+
 ## Nuxt 2 without bridge
 
 Pinia supports Nuxt 2 until `@pinia/nuxt` v0.2.1. Make sure to also install [`@nuxtjs/composition-api`](https://composition-api.nuxtjs.org/) alongside `pinia`:
index e02f61177cbf9f5d34f94ce71d636de0853222a9..b373d4c4c5d2aa864bcb559b68149af7f211ebad 100644 (file)
@@ -26,7 +26,7 @@ export interface ModuleOptions {
    * directly adding the dirs to the `imports.dirs` option. If you want to
    * also import nested stores, you can use the glob pattern `./stores/**`
    *
-   * @default `['./stores']`
+   * @default `['stores']`
    */
   storesDirs?: string[]
 }
@@ -42,7 +42,6 @@ const module: NuxtModule<ModuleOptions> = defineNuxtModule<ModuleOptions>({
   },
   defaults: {
     disableVuex: true,
-    storesDirs: ['./stores'],
   },
   setup(options, nuxt) {
     const resolver = createResolver(import.meta.url)
@@ -92,6 +91,11 @@ const module: NuxtModule<ModuleOptions> = defineNuxtModule<ModuleOptions>({
       { from: composables, name: 'usePinia' },
     ])
 
+    if (!options.storesDirs) {
+      // resolve it against the src dir which is the root by default
+      options.storesDirs = [resolver.resolve(nuxt.options.srcDir, 'stores')]
+    }
+
     if (options.storesDirs) {
       for (const storeDir of options.storesDirs) {
         addImportsDir(resolver.resolve(nuxt.options.rootDir, storeDir))