Nonviolent Pigeon Manifestation

    kentico-kontent-nuxt-module
    TypeScript icon, indicating that this package has built-in type declarations

    8.0.1 • Public • Published

    CircleCI semantic-release NPM

    kentico-kontent-nuxt-module

    Add Kentico Kontent super power to your nuxt app 🔥

    Features

    The module makes it easy to do delivery client api calls via the Kentico kontent Delivery JS SDK.

    Quick start

    • Install via npm
    npm i kentico-kontent-nuxt-module --save
    
    • Add kentico-kontent-nuxt-module to modules section of nuxt.config.js
      /*
      ** Nuxt.js modules
      */
      modules: [
        'kentico-kontent-nuxt-module'
      ],
      kenticokontent: {
        projectId: 'xxxx-xxx-xxxx-xxxx-xxxxx',
        enableAdvancedLogging: false,
        previewApiKey: 'xxxxxxxxxxxxxxxxxxxxxxxxxxx',
        globalQueryConfig: {
    			usePreviewMode: true, // Queries the Delivery Preview API.
          useSecureMode: false,
    		},
        baseUrl: 'https://custom.uri/api/KenticoKontentProxy',
        secureApiKey: 'xxx',
        enableSecuredMode: true
      },

    Note: See the client configuration section of the Kentico Kontent Delivery SDK for all available configuration options.

    • $nuxtDeliveryClient is now globally available.
     this.$nuxtDeliveryClient.items()
        .type('page')
        .toPromise()
        .then(response => console.log('DeliveryClient Response', response));

    Note:

    By default Nuxt can only work with promises. Therefor you always use the "toPromise" method provided by the Kentico Kontent Delivery SDK! RxJs operator's are not supported at the moment.

    Typescript

    Since version 7 the kentico-kontent-nuxt-module has typescript support!

    Add the types to your "types" array in tsconfig.json after the @nuxt/types (Nuxt 2.9.0+) or @nuxt/vue-app entry

     {
      "compilerOptions": {
        "types": [
          "@nuxt/types",
          "kentico-kontent-nuxt-module"
        ]
      }
    }
    

    Generating

    When using a static generated deployment you may need to use the items-feed endpoint when generating your site (because the items endpoint has a rate limitation).

     this.$nuxtDeliveryClient.itemsFeedAll()
        .toPromise()
        .then(response => console.log('DeliveryClient Response', response));

    Caching

    API calls can be "cached" (they will be stored in memory) client side via the "viaCache" method.

     const query =  this.$nuxtDeliveryClient.items().type('page');
     const cacheSeconds = 30;
     this.$nuxtDeliveryClient.viaCache(query, cacheSeconds)
            .then(response => console.log('DeliveryClient Response', response));

    Extending

    If you need to customize the Kentico Kontent Delivery SDK by registering interceptors and changing global config, you have to create a nuxt plugin.

    nuxt.config.js

    {
      modules: [
        'kentico-kontent-nuxt-module',
      ],
    
      plugins: [
        '~/plugins/kenticokontentNuxtModule'
      ]
    }

    plugins/kenticokontentNuxtModule.js

    export default function ({ store, $nuxtDeliveryClient }) {
        $nuxtDeliveryClient.config.globalHeaders = (queryConfig) => {
            let headers = [];
            headers.push({header: 'Authorization', value: 'bearer ' + store.state.token });
            return headers;
          }
      }

    Type Resolvers

    Type resolvers can also be registered by using a nuxt plugin:

    plugins/kenticokontentNuxtModule.js

    import { TypeResolver, ContentItem } from '@kentico/kontent-delivery';
    
    class Page extends ContentItem {
        constructor() {
            super({
                richTextResolver: (item, context) => {
                    // todo: implement
                },
                urlSlugResolver: (link, context) => {
                    // todo: implement
                }
            });
        }
    }
    
    export default function ({ store, app, $nuxtDeliveryClient }) {
        $nuxtDeliveryClient.config.typeResolvers = [
            new TypeResolver('page', () => new Page())
        ]
    }

    Install

    npm i kentico-kontent-nuxt-module

    DownloadsWeekly Downloads

    221

    Version

    8.0.1

    License

    ISC

    Unpacked Size

    13.3 kB

    Total Files

    8

    Last publish

    Collaborators

    • domitnator