Vue Storefront Algolia

# Installation

To install modules in your Vue Storefront application, use the following commands:

npm install @vsf-enterprise/algolia --save;
npm install @vsf-enterprise/algolia-api --save;

or:

yarn add @vsf-enterprise/algolia;
yarn add @vsf-enterprise/algolia-api;

# Setup

Inside of the middleware.config.js file, add the algolia object to the integrations:

// middleware.config.js
module.exports = {
  integrations: {
    algolia: {
      location: '@vsf-enterprise/algolia-api/server',
      configuration: {
        appId: '<your_app_id>',
        searchApiKey: '<your_search_api_key>',
        entities: {
          product: {
            'name:asc': {
              index: '<your_index_in_algolia>',
              label: 'Name A-Z',
              default: true
            }
          }
        }
      }
    },
    // ... other configs
  },
}

appId - value of Application ID in API Keys page in Algolia's Dashboard

searchApiKey - value of Search API Key in API Keys page in Algolia's Dashboard - please do not use any Admin Keys to retrieve data from the platform

entities.product['name:asc'].index - name of main index with the data in Algolia's Dashboard

Then, in the nuxt.config.js file register the module:

// nuxt.config.js
modules: ['@vsf-enterprise/algolia/nuxt']

TIP

In case of using i18n module with your application please keep the proper order of modules registration. You can read more about it here (opens new window).

Finally, add the module to both arrays in the useRawSource object in the @vue-storefront/nuxt module:

// nuxt.config.js
['@vue-storefront/nuxt', {
  ...
  useRawSource: {
    dev: ['@vsf-enterprise/algolia'],
    prod: ['@vsf-enterprise/algolia'],
  }
}],

← Usage →