Skip to content

Nuxt Module

Feathers-Pinia v3 comes with a Nuxt Module. It provides two main features:

Installation

Install the Nuxt module from npm:

bash
npm i nuxt-feathers-pinia

Once installed, add its name to the nuxt.config.ts file. You can optionally use the dirs key to enable auto-imports in other directories (in addition to /composables.)

ts
// nuxt.config.ts
// https://v3.nuxtjs.org/api/configuration/nuxt.config
export default defineNuxtConfig({
  modules: [
    '@pinia/nuxt',
    'nuxt-feathers-pinia',
  ],
  imports: {
    // Not required, but useful: list folder names here to enable additional "composables" folders.
    dirs: [],
  },
  // Enable Nuxt Takeover Mode
  typescript: {
    shim: false,
  },
  // optional, Vue Reactivity Transform
  experimental: {
    reactivityTransform: true,
  },
})

You can read more about the above configuration at these links:

If you use npm as your package manager and you see the error ERESOLVE unable to resolve dependency tree, add this to your package.json:

json
{
  "overrides": {
    "vue": "latest"
  }
}

Auto-Imported Composables

You can use these utilities with auto-imports configured.

  • createPiniaClient creates a Feathers-Pinia client from a Feathers Client.
  • useInstanceDefaults for implicit modeling, sets up default values on instances.
  • useAuth for creating auth stores.
  • useDataStore for managing non-service data stores with the same local API.
  • defineValues for adding configurable, non-enumerable properties to items.
  • defineGetters for adding configurable, non-enumerable getters to items.
  • defineSetters for adding configurable, non-enumerable setters to items.

Many thanks go to the Vue and FeathersJS communities for keeping software development FUN!