bcms
@thebcms/nuxt

Nuxt BCMS モジュール

Nuxt BCMS

npm versionnpm downloadsLicenseNuxt

BCMSNuxt の連携。

機能

  • BCMSとのシームレスな連携
  • BCMS画像とコンテンツをレンダリングするためのコンポーネントを標準で提供
  • BCMSからTypeScript型を自動生成
  • サーバーサイドとクライアントサイドでBCMSクライアントAPIに簡単にアクセス
  • プライベートAPIキーとパブリックAPIキーをサポート

クイックセットアップ

1つのコマンドでモジュールをNuxtアプリケーションにインストールします

npx nuxi module add bcms

次に、nuxt.config.tsファイルにBCMS設定を追加します。設定情報はBCMSダッシュボードのAPI Keysセクションで確認できます。

export default defineNuxtConfig({
    modules: ['@thebcms/nuxt'],
    // ...
    bcms: {
        orgId: process.env.BCMS_ORG_ID,
        instanceId: process.env.BCMS_INSTANCE_ID,
        privateClientOptions: {
            key: {
                id: process.env.BCMS_PRIVATE_KEY_ID,
                secret: process.env.BCMS_PRIVATE_KEY_SECRET,
            },
            options: {
                injectSvg: true,
            },
        },
        publicClientOptions: {
            key: {
                id: process.env.BCMS_PUBLIC_KEY_ID,
                secret: process.env.BCMS_PUBLIC_KEY_SECRET,
            },
            options: {
                injectSvg: true,
            },
        },
    },
});

これで完了です!NuxtアプリでBCMSを使用できるようになりました✨

NuxtでBCMSを使用する方法の詳細については、ドキュメントをご確認ください。

貢献

ローカル開発
# Install dependencies
npm install

# Generate type stubs

npm run dev:prepare

# Develop with the playground

npm run dev

# Build the playground

npm run dev:build

# Run ESLint

npm run lint

# Run Vitest

npm run test
npm run test:watch

# Release new version

npm run release