Setup

Installation

1. Add @nuxtjs/strapi module to your project:

npx nuxi@latest module add strapi

2. Add it to the modules section in your nuxt.config.ts:

export default defineNuxtConfig({
  modules: ['@nuxtjs/strapi'],
  strapi: {
    // Options
  }
})

Options

Defaults:

{
  url: process.env.STRAPI_URL || 'http://localhost:1337',
  token: process.env.STRAPI_TOKEN || undefined
  prefix: '/api',
  admin: '/admin',
  version: 'v5',
  cookie: {},
  cookieName: 'strapi_jwt'
}

If you want to override any options on runtime, you may use Nuxt 3 runtime-config:

export default defineNuxtConfig({
  // Example of separate client/server URLs
  runtimeConfig: {
    strapi: {
      url: 'http://localhost:1337'
    },
    public: {
      strapi: {
        url: 'http://localhost:1337'
      }
    }
  }
})

url

URL of the Strapi server.

Environment variable STRAPI_URL can be used to override url.

admin

Specify admin prefix used by your Strapi.

prefix

Prefix of the Strapi server. Not for version v3.

Learn how to change the default API prefix in your Strapi server.

version

Version of the Strapi server. Can only be v5/v4/v3.

cookie

Cookie options of the Strapi token cookie.

All cookie options can be found in the Nuxt documentation

cookieName

Cookie name of the Strapi token cookie

auth.populate v1.5.0+ Strapi v4.2.2+

Configure the populate query param of the /users/me route.

Learn more on Populating documentation.

auth.fields v1.7.0+ Strapi v4.2.2+

Configure the fields query param of the /users/me route.

Learn more on Field Selection documentation.

devtools v1.9.0+

Embed the Strapi admin to the Nuxt Devtools, read more in the Devtools section.

Edge

To use the latest updates pushed on the dev branch, you can use @nuxtjs/strapi-edge.

Update your package.json to the following:

{
  "devDependencies": {
-   "@nuxtjs/strapi": "^1.9.2"
+   "@nuxtjs/strapi": "npm:@nuxtjs/strapi-edge@latest"
  }
}

Then run pnpm install, yarn install or npm install.