JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 466
  • Score
    100M100P100Q109205F
  • License Apache-2.0

microCMS integration for Nuxt.js

Package Exports

  • nuxt-microcms-module
  • nuxt-microcms-module/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (nuxt-microcms-module) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

⚠️ Nuxt3 is not supported. Please use Nuxt2.

nuxt-microcms-module

microCMS integration for Nuxt.

Getting Started

Install

$ npm install nuxt-microcms-module

Setup

// nuxt.config.js

export default {
  modules: ['nuxt-microcms-module'],
  microcms: {
    options: {
      serviceDomain: "YOUR_DOMAIN", // YOUR_DOMAIN is the XXXX part of XXXX.microcms.io
      apiKey: "YOUR_API_KEY",
    },
    mode: process.env.NODE_ENV === 'production' ? 'server' : 'all',
  },
};

options.serviceDomain

String
Your service id, which is a subdomain of microCMS.

options.apiKey

String
Your api-key.
It can be obtained from the service settings.

mode

String (can be client or server or all)
If defined, this module will be included only on the respective (client or server) side.

Hot to use

This package uses microcms-js-sdk.
You can get microCMS client ($microcms) from context.
Please see the URL below for details.
https://github.com/microcmsio/microcms-js-sdk#how-to-use

// pages/index.vue

<template>
  <ul>
    <li v-for="content in contents" :key="content.id">
      <nuxt-link :to="`/${content.id}`">
        {{ content.title }}
      </nuxt-link>
    </li>
  </ul>
</template>

<script>
export default {
  async asyncData({ $microcms }) {
    const data = await $microcms.get({
      endpoint: 'your_endpoint',
      queries: { limit: 20, filters: 'createdAt[greater_than]2021' },
    });
    return data;
  }
}
</script>

LICENSE

Apache-2.0