Skip to content

Feature Request: Allow external modules to provide colada optionsΒ #408

@productdevbook

Description

@productdevbook

Problem

Currently, @pinia/colada-nuxt only loads colada.options.ts from the consuming project's root directory:

// nuxt/src/module.ts
const coladaOptionsPath = resolve(nuxt.options.rootDir, 'colada.options')

This makes it impossible for Nuxt modules/layers to provide default Pinia Colada configurations (like global error handling) to consuming projects.

Use Case

I'm building a shared Nuxt module (nuxt-shared) that provides:

  • Authentication
  • Authorization
  • GraphQL integration
  • Global error handling for GraphQL errors

I want to provide default PiniaColadaQueryHooksPlugin configuration with onSuccess and onError hooks, but currently:

  • ❌ Can't export colada options from my module
  • ❌ Users must manually create colada.options.ts in every project
  • ❌ Can't share error handling logic across projects

Proposed Solution

Allow modules to register colada options via Nuxt module hooks:

Option 1: Module Hook

// In my nuxt-shared module
export default defineNuxtModule({
  setup(options, nuxt) {
    nuxt.hook('pinia-colada:options', (coladaOptions) => {
      // Merge module's default options
      coladaOptions.plugins = coladaOptions.plugins || []
      coladaOptions.plugins.push(
        PiniaColadaQueryHooksPlugin({
          onError: (error) => { /* handle */ }
        })
      )
    })
  }
})

Option 2: Module Config

// nuxt.config.ts
export default defineNuxtConfig({
  modules: ['@pinia/colada-nuxt'],
  
  piniaColada: {
    // Inline options (instead of colada.options.ts)
    plugins: [/* ... */],
    queryOptions: { /* ... */ }
  }
})

Option 3: Multiple Config Files

// Load from multiple sources and merge
const configs = [
  // From modules
  ...nuxt.options._layers.map(layer => 
    resolve(layer.config.srcDir, 'colada.options')
  ),
  // From project root (highest priority)
  resolve(nuxt.options.rootDir, 'colada.options')
]

Benefits

  1. βœ… Reusable configurations - Share error handling across projects
  2. βœ… Better DX - Modules can provide sensible defaults
  3. βœ… No breaking changes - Project-level config still works
  4. βœ… Composable - Multiple modules can contribute options

Workaround (Current)

Currently, I'm forced to:

  1. Create a plugin in my module
  2. Manually call app.use(PiniaColada, options)
  3. Hope it runs in the correct order

This bypasses @pinia/colada-nuxt's built-in setup and SSR handling.

References

  • Similar pattern in @nuxtjs/i18n: Supports both config file and inline options
  • Nuxt layers: Other modules can extend from layers
  • Code reference:
    nuxt.options.vite.optimizeDeps.exclude.push('@pinia/colada')
    }
    // Do not add the extension since the `.ts` will be transpiled to `.mjs` after `npm run prepack`
    addPlugin(resolve('./runtime/plugin'))

Would love to hear thoughts on this! Happy to contribute a PR if there's interest. πŸ™

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    Status

    Done

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions