Skip to main content

HunchJS Intro

Let's discover HunchJS in less than 5 minutes.

Getting Started​

Walk through this tutorial to add HunchJS to an 11ty site that deploys to Cloudflare Pages.

What you'll need​

Configure and compile the search index​

Once configured, use HunchJS to compile the contents to a search index.

hunch
# shorthand for
hunch --config hunch.config.js

This generates a JSON file containing the search index.

Query the search index​

The environment you use will determine the specifics of loading the index (a plain JavaScript/JSON object), but querying will look the same:

import { hunch } from 'hunch'
const index = { /* the loaded index */ }
const search = hunch({ index })
const results = search({ q: 'all your base' })

Local development​

Use the --watch flag to rebuild the index when your content files change.

Use the --serve (or --serve 3030 for a custom port) to launch a simple HTTP server that uses the canonical (but optional!) query parameters.

When using --serve you can also include --delay N to add N milliseconds of delay on the local server response. For example, --delay 1200 will add 1.2 seconds of delay. This can be useful to see how normal network response latency will impact your user experience.