Configuration


Options

You can add custom configuration to the module like following:

nuxt.config.js
export default defineNuxtConfig({  modules: ['@nuxtjs/algolia'],  algolia: {    // options  }})

Or

nuxt.config.js
export default defineNuxtConfig({  modules: [    ['@nuxtjs/algolia', {      // options    }]  ]})

Defaults:

{  apiKey: '<YOUR_SEARCH_API_KEY>',  applicationId: '<YOUR_APPLICATION_ID>',  globalIndex: '',  lite: true,  cache: false,  instantSearch: true,   useFetch: false,  crawler: {    apiKey: '<YOUR_API_KEY>',    indexName: '<YOUR_INDEX_NAME>',    meta: ['title', 'description'],    include: () => true  },  recommend: true,  indexer: {    storyblok: {      secret: 'INDEXER_SECRET',      algoliaAdminApiKey: 'ALGOLIA_ADMIN_KEY',      indexName: 'ALGOLIA_INDEX_NAME',      accessToken: 'STORYBLOK_ACCESS_TOKEN'    }  }}

For storing sensitive data such as API keys or Application ID variables we recommend using environment variables (apiKey is ALGOLIA_API_KEY and applicationId is ALGOLIA_APPLICATION_ID) that can later be loaded to Nuxt runtime config. Check out more here.

apiKey

This is the public API key to use in your frontend code. This key is only usable for search queries and sending data to the Insights API.

You can read more about it here

applicationId

This is your unique application identifier. It's used to identify you when using Algolia's API.

You can get it here

globalIndex

By default set to empty string. When set in the configuration object, it will use this index name for all useAlgoliaSearch composables. Then, you do not need to pass the index name as a parameter of this composable.

lite

By default set to true. Indicates whether to use 'algoliasearch-lite' or normal 'algoliasearch' package. Depending on your needs, if you only need to search you can set this option to true or do not set any option (it is by default true). But if you need more advances functionalities like multi queries, indexing, etc, you can set it to false to load full algoliasearch client.

You can get it here

cache

By default set to false. The client caches requests to Algolia and their responses.

More information available in the official Algolia docs.

useFetch

By default set to false. If set to true, it will use @algolia/requester-fetch instead of @algolia/requester-node-http. This enables SSR-support for using this module in V8-based environments like Vercel Edge, Cloudflare Workers etc.

instantSearch

By default set to false. Indicates whether to install the official vue-instantsearch plugin. This option can also be an object (see below).

More information available in the official Algolia docs.

instantSearch.theme

By default set to satellite. Indicates which CSS theme to use for the vue-instantsearch plugin. Valid values are satellite, reset or algolia.

More information available in the official Algolia docs.

crawler

Indicates whether you would like the module to automatically index your pages when using Nuxt static site generation. Both the apiKey and the indexName need to be set for this feature to be enabled.

crawler.apiKey

By default this option is not set. This is your private API key to use in your backend code. This key is used to update your Algolia index. DO NOT USE YOUR ADMIN KEY! Instead use your admin key to generate another limited key with at least the addObject and deleteObject rights.

You can read more about it here

crawler.indexName

By default this option is not set. This is the name of your Algolia index that will store all your pages' metadata.

You can check out how to create a new index here

crawler.meta

By default this option is set to ['title', 'description']. This is the list of metafields that you would like to store when indexing a page. It can either be an array of fields or a function that returns an object of fields. The function should return a string and can be asynchronous.

Array
{  ...  meta: ['title', 'description', 'lang']}
Function
{  ...  meta: async (html: string, route: string) => {    const result = await somePromise(route)    return {      ...result,      foo: 'bar'    }  }}

crawler.include

By default this option is not set. This option is used to filter the pages that you would like to index by their route. It can either be an array of strings and/or regular expressions, or a function that should return a boolean. If the option is undefined, then all pages are indexed (default).

Array
{  ...  include: ['/foo', /^(?!\/?admin).+/]}
Function
{  ...  include: (route: string) => {    return !route.startsWith('admin')  }}

recommend

When set to true it will import the @algolia/recommend library used for useAlgoliaRecommend composable to get the recommendations based on certain criteria.

You can read more here

indexer

Configuration for automatic indexing of Algolia index by external Content Management System or another source. For now it supports only Storyblok but will support more in the future.

indexer.storyblok

Configuration object for using Storyblok as CMS provider in automatic indexing.

  • secret used to verify if an automatic indexing can be triggered. It is a HTTP query sent via GET request and validated with a private runtime config property. Remember to add it to your webhook configuration.
  • algoliaAdminApiKey used to populate Algolia index programatically.
  • indexName name of the Algolia index that will be populated after the indexing.
  • accessToken to Storyblok space.