3.search.md

title	description
Search	With some simple configuration and a composable, you can add search to your Nuxt Content site.

Usage

First, you need to enable the search feature in your nuxt.config.ts:

export default defineNuxtConfig({
  content: {
    experimental: {
      search: true
    }
  }
})

::callout You can use the search feature with any Nuxt Content source. You can also enable or not the document-driven feature. ::

Search

You can use the searchContent composable to search in your content directory:

<script lang="ts" setup>
const search  = ref('')

const results = searchContent(search)
</script>

<template>
  <main>
    <input v-model="search">

    <pre>{{ result }} </pre>
  </main>
</template>

By default, the searchContent composable will use an indexed search. This mean that the search will be faster and the API response smaller and optimized only usable by miniSearch.

::callout Internally, the search feature, both searchContent and /api/indexed-search.ts endpoint, use miniSearch. ::

Simple Search

If needed, you can disable the indexed search and use a simple search instead:

export default defineNuxtConfig({
  content: {
    experimental: {
      search: {
        indexed: false
      }
    }
  }
})

Remember that the simple search is slower and the API response bigger. You can still use the searchContent composable which is agnostic of the search type.

Custom Search

Using the simple search, aka non-indexed search, you can use the tool of your choice to search in the API response. For example, you can use fuse.js with the integration of @vueuse/integrations:

export default async function customSearchContent(search: Ref<string>) {
  const runtimeConfig = useRuntimeConfig()
  const { integrity, api } = runtimeConfig.public.content

  const { data } = await useFetch(`${api.baseURL}/search${integrity ? '.' + integrity : ''}.json`)

  const { results } = useFuse(search, data)

  return results
}

Configuration

Please, read the configuration section to learn more about the search options.