# Configuration

The commercetools configuration is located in two places:

  • nuxt.config.js is a place where you're configuring properties related only to the frontend part of your application.

  • middleware.config.js is a place where you're configuring the commercetools SDK, Apollo, and extensions. You will put there API keys, integration configurations, custom GraphQL queries, and new API endpoints.

# Nuxt commercetools configuration

// nuxt.config.js
['@vue-storefront/commercetools/nuxt', {
  i18n: {
    useNuxtI18nConfig: true
  }
}]
  • useNuxtI18nConfig - when this property is set to true, @vue-storefront/commercetools/nuxt package will use i18n config object provided in nuxt.config.js. When set to false, i18n config should be declared directly inside this package configuration. You can read more about i18n config in Vue Storefront here

# Middleware commercetools configuration

You can read more about middleware configuration in Vue Storefront here

// middleware.config.js
module.exports = {
  integrations: {
    ct: {
      location: '@vue-storefront/commercetools-api/server',
      configuration: {
        api: {
          uri: 'https://<DOMAIN_NAME>.com/<PROJECT_KEY>/graphql',
          authHost: 'https://auth.sphere.io',
          projectKey: '<PROJECT_KEY>',
          clientId: '<CLIENT_ID>',
          clientSecret: '<CLIENT_SECRET>',
          scopes: [
            'manage_products:<PROJECT_KEY>',
            /* other scope rules */
          ]
        }
      }
    }
  }
};

# api

By default, the internationalization settings, such as currency, locale, and country are loaded from cookies. To override this behavior, you can set those properties inside the configuration section.

// middleware.config.js
module.exports = {
  integrations: {
    ct: {
      location: '@vue-storefront/commercetools-api/server',
      configuration: {
        api: { /* ... */},
        currency: 'EUR',
        locale: 'en',
        country: 'US'
      }
    }
  }
};

# acceptLanguage

An array of possible locales commercetools will use. You can read more about the commercetools internationalization configuration here (opens new window)

acceptLanguage: ['en-gb', 'en-us']

# languageMap

If you supply a languageMap during the setup, this will be used to map a locale to the accepted languages.

languageMap: {
  'en-gb': ['en-gb', 'en-us'],
  'en-us': ['en-us', 'en-gb'],
}

# inventoryMode

If you want to change the way your commercetools inventory is being tracked, you can provide inventoryMode option in the middleware configuration. It can be set to one of the following values: None, TrackOnly, and ReserveOnOrder. When not specified, the Inventory Mode is set to None by default. You can read more about Inventory Modes in commercetools documentation (opens new window).

inventoryMode: 'TrackOnly'