webpackfull-text-searchbabeljslunrjs

Searchable JS/Next.js site text extraction


I have a Next.js documentation site at https://logary.tech source, and would like to implement the document search, e.g. with Lunr.

How do I program babel/webpack/nextjs to also extract text (perhaps as a pre-compilation step/babel plugin), into a json file, that I can use for input to Lunr?


Solution

  • I chose to use hgtmlparser2 as part of the build pipeline against the dev server; this if found in the buildIndex.js file.

    It outputs pages.json (in this commit you see the stub; browse forward in history for impl) — which is then compiled into the web app.

    Then I use LunR to perform the search.

    From this commit: https://github.com/logary/logary/commit/d824089e29c8d40624758431f4f58d3ae1433d97