Nuxt BCMS
機能
- 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