v3.1.1

What's Changed

• v3.1.1 Nodeのアップデート + NPM Publishの方法をセキュアなものに変更 by @dc7290 in #21

Full Changelog: v3.1.0...v3.1.1

v3.1.0

What's Changed

• enhance: Support Nuxt v4 by @kakkokari-gtyih in #17
• Version 3.1.0 by @dc7290 in #18
• nodejsのバージョンを22.17.1に更新し、GitHub Actionsの設定を16.xから22.xに変更 by @dc7290 in #20

New Contributors

• @kakkokari-gtyih made their first contribution in #17

Full Changelog: v3.0.2...v3.1.0

v3.0.2

What's Changed

• 環境変数がクライアントサイドで読み込まれない問題を修正 by @dc7290 in #13
• Version 3.0.2 by @dc7290 in #14

Full Changelog: v3.0.1...v3.0.2

v3.0.1

What's Changed

• queriesにリアクティブな値が設定できない不具合を修正 by @dc7290 in #10
• version3.0.1 by @dc7290 in #12

Full Changelog: v3.0.0...v3.0.1

v3.0.0

Supported Nuxt3 🎉

Nuxt3に対応しました！
Nuxt3からはフェッチの扱いがNuxt2から変更されており、このバージョンには破壊的変更が含まれます。
そのため引き続きNuxt2をお使いの方は npm install nuxt-microcms-module@2 でご使用ください。

Usage

// nuxt.config.ts

export default defineNuxtConfig({
  modules: ['nuxt-microcms-module'],
  microCMS: {
    serviceDomain: 'YOUR_DOMAIN',
    apiKey: 'YOUR_API_KEY',
  },
});

<template>
  <ul>
    <li v-for="blog in blogs?.contents" :key="blog.id">
      <NuxtLink :to="`/${blog.id}`">
        <img
          :src="blog.eyecatch.url"
          :width="blog.eyecatch.width"
          :height="blog.eyecatch.height"
          alt=""
        />
        <span>
          {{ blog.title }}
        </span>
      </NuxtLink>
    </li>
  </ul>
</template>

<script setup lang="ts">
import type { MicroCMSImage } from 'microcms-js-sdk';

type Blog = {
  title: string;
  eyecatch: MicroCMSImage;
};

const { data: blogs } = await useMicroCMSGetList<Blog>({
  endpoint: 'blogs',
  queries: { fields: ['id', 'title', 'eyecatch'] },
});
</script>

Reference

type useMicroCMSGetList = <T>(
  args: {
    endpoint: string;
    queries?: MicroCMSQueries;
  },
  fetchOptions?: FetchOptions
) => Promise<AsyncData<MicroCMSListResponse<T>>>;
type useMicroCMSGetListDetail = <T>(
  args: {
    endpoint: string;
    contentId: string;
    queries?: MicroCMSQueries;
  },
  fetchOptions?: FetchOptions
) => Promise<AsyncData<T & MicroCMSListContent>>;
type useMicroCMSGetObject = <T>(
  args: {
    endpoint: string;
    queries?: MicroCMSQueries;
  },
  fetchOptions?: FetchOptions
) => Promise<AsyncData<T & MicroCMSObjectContent>>;

// FetchOptions is the same as the second argument option of useFetch provided by Nuxt3.
// AsyncData is the return value of useFetch.
// https://nuxt.com/docs/api/composables/use-fetch

What's Changed

• Supported Nuxt3 by @dc7290 in #5

Full Changelog: v2.0.1...v3.0.0

新形式APIキー(X-MICROCMS-API-KEY)対応

新形式APIキー(X-MICROCMS-API-KEY)対応

Features

新APIキーのリニューアルに伴い内部のリクエストをX-MICROCMS-API-KEYに変更しました。旧APIキーに互換性があるので、既存のAPIに影響はありません。