プログラマティックな利用方法

$contentは @nuxt/contentからアクセスできます

export default {  modules: [    '@nuxt/content'  ],  generate: {    async ready () {      const { $content } = require('@nuxt/content')      const files = await $content().only(['slug']).fetch()      console.log(files)    }  }}

静的サイト生成

nuxt generate を利用する場合は、generate.routes で動的ルートを指定する必要があります。 なぜなら、Nuxtはこれらのルートが何になるかわからないので、ルートを生成できないからです。

例

export default {  modules: [,    '@nuxt/content'  ],  generate: {    async routes () {      const { $content } = require('@nuxt/content')      const files = await $content().only(['path']).fetch()      return files.map(file => file.path === '/index' ? '/' : file.path)    }  }}

フック

いくつかのフックを提供します。

content:file:beforeInsert

保存する前にドキュメントへデータを追加できます。

Arguments:

• document
  • Type: object
  • Properties:
    • コンテンツを作成するを参照してください。

例

ブログのスターターを例にとると、reading-Timeを利用したreadingTime をドキュメントへ追加するために、file:beforeInsertを使うことができます。

textは、JSON ASTに変換される前のMarkdownファイルのbodyの内容で、この時点では使用できますが、APIからは返されません。

export default {  modules: [,    '@nuxt/content'  ],  hooks: {    'content:file:beforeInsert': (document) => {      if (document.extension === '.md') {        const { time } = require('reading-time')(document.text)        document.readingTime = time      }    }  }}

ホットリロードの取り扱い

イベントを待ち受けてさらに何かをしたい場合は、$nuxt.$on('content:update')を使ってクライアント側で content:update イベントを待ち受けることができます。

export default function ({ store }) {  // 開発時のみ  if (process.dev) {    window.onNuxtReady(($nuxt) => {      $nuxt.$on('content:update', ({ event, path }) => {        // storeのカテゴリを更新        store.dispatch('fetchCategories')      })    })  }}

nuxt.config.jsにプラグインを追加します。

export default {  plugins: [    '@/plugins/update.client.js'  ]}

これで、content/ディレクトリ内のファイルを更新するたびに、fetchCategoriesメソッドもディスパッチされます。 このドキュメントサイトでは実際にそれを使用しています。plugins/init.jsを見れば、より多くのことを学ぶことができます。

APIエンドポイント

このモジュールは開発中のAPIエンドポイントを公開し、各ディレクトリやファイルのJSONを簡単に見ることができるようにします。http://localhost:3000/_content/で利用可能です。プレフィックスはデフォルトでは _contentで、apiPrefixプロパティで設定できます。

例：

-| content/---| articles/------| hello-world.md---| index.md---| settings.json

localhost:3000で公開されます:

• /_content/articles: content/articles/のファイルのリスト
• /_content/articles/hello-world: hello-world.md をJSONで取得
• /_content/index: index.md をJSONで取得
• /_content/settings:settings.json をJSONで取得
• /_content: index と settingsのリスト

エンドポイントは GET や POST リクエストでアクセスできるので、クエリのパラメーターを利用できます。: http://localhost:3000/_content/articles?only=title&only=description&limit=10.

v1.4.0以降、このエンドポイントはクエリパラメーターの whereもサポートしています。

• デフォルトのキーに属さないすべてのキーが whereに適用されます。

http://localhost:3000/_content/articles?author=...

• $operatorsは_と一緒に使うことができます。

http://localhost:3000/_content/articles?author_regex=...

このモジュールは 、内部的にLokiJSを使用しています。、あなたはクエリの例（https://github.com/techfort/LokiJS/wiki/Query-Examples#find-queries）をチェックすることができます。

• nested propertiesも利用できます

http://localhost:3000/_content/products?categories.slug_contains=top

このエンドポイントについての詳細は lib/middleware.jsを参照してください。