https://github.com/xlanex6/nuxt-meilisearch

🔎 Meilisearch module for Nuxt 3
https://github.com/xlanex6/nuxt-meilisearch

meilisearch meilisearch-nuxt nuxt nuxt-module nuxt3 nuxtjs

Last synced: 4 days ago
JSON representation

🔎 Meilisearch module for Nuxt 3

• Host: GitHub
• URL: https://github.com/xlanex6/nuxt-meilisearch
• Owner: xlanex6
• License: mit
• Created: 2022-05-06T21:38:12.000Z (over 2 years ago)
• Default Branch: master
• Last Pushed: 2024-08-20T07:11:36.000Z (4 months ago)
• Last Synced: 2024-12-01T00:37:37.671Z (12 days ago)
• Topics: meilisearch, meilisearch-nuxt, nuxt, nuxt-module, nuxt3, nuxtjs
• Language: Vue
• Homepage: https://nuxt-meilisearch.vercel.app
• Size: 2.6 MB
• Stars: 119
• Watchers: 1
• Forks: 16
• Open Issues: 5
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-meilisearch - Nuxt - A Nuxt 3 module (Integrations / Community Integrations)

README

        
[![xlanex6/nuxt-meilisearch](./docus/public/cover.png)](https://nuxt-meilisearch.vercel.app/)



[![Latest Stable Version](https://img.shields.io/npm/v/nuxt-meilisearch.svg?style=for-the-badge)](https://www.npmjs.com/package/nuxt-meilisearch) [![License](https://img.shields.io/npm/l/nuxt-meilisearch.svg?style=for-the-badge)](https://www.npmjs.com/package/nuxt-meilisearch)

[![Twitter Follow](https://img.shields.io/twitter/follow/xlanex6?color=1DA1F2&logo=twitter&style=for-the-badge)](https://twitter.com/xlanex6)



# Nuxt Meilisearch

Integrate [Meilisearch](https://meilisearch.com/?utm_campaign=oss&utm_source=github&utm_content=nuxt-meilisearch) fast and hyper-relevant search engine in your [Nuxt](https://nuxt.com) application.

Read [Nuxt Meilisearch documentation](https://nuxt-meilisearch.vercel.app).

## Features

- Nuxt 3 integration

- Auto-imported composables

- Server-side rendering support

- Client & server integration of Meilisearch

- Full TypeScript support

- Compatible with [Instant Meilisearch](https://github.com/meilisearch/instant-meilisearch)

- Vue [Algolia InstantSearch](https://github.com/algolia/instantsearch) components (optional)

## Installation

Add `nuxt-meilisearch` using the Nuxt CLI to your project

```bash

npx nuxi@latest module add nuxt-meilisearch

```

or add `nuxt-meilisearch` using your dependency manager

```bash

# with npm

npm install nuxt-meilisearch

# with yarn

yarn add nuxt-meilisearch

# with pnpm

pnpm add nuxt-meilisearch

```

and then to the `modules` section of `nuxt.config.ts`:

 ```ts

// nuxt.config.ts

export default defineNuxtConfig({

  modules: [

    'nuxt-meilisearch'

  ],

  meilisearch: {

    hostUrl:  '', //required

    searchApiKey: '', // required

    adminApiKey: '', // optional

    serverSideUsage: true // default: false

})

```

That's it! 🎉

## Usage

This example performs a search in the `books` index:

```html

const { search, result } = useMeiliSearch('books')

onMounted(async () => {

  await search('harry');

})

  


    {{ result }}

  


```

Learn more in the [Nuxt Meilisearch documentation](https://nuxt-meilisearch.vercel.app).

## Contributing

Issues and pull requests are welcome. 🫶

**Local development**

- Run `npm run dev:prepare` to generate type stubs.

- Use `npm run dev` to start [playground](./playground) in development mode.

## Licence

[MIT Licence](./LICENCE)