Git Product home page Git Product logo

docusaurus-lunr-search's Introduction

docusaurus-lunr-search

Offline Search for Docusaurus V2 or V3

Demo Website

MIT Licence

npm version

Sample

image

Prerequisites

  • Docusaurus V2 or V3
  • Node.js >= 12.X

How to Use ?

  1. Install this package
yarn add docusaurus-lunr-search

or

npm i docusaurus-lunr-search  --save

If npm install fails to install with error unable to resolve dependency tree, run npm i --legacy-peer-deps

  1. Some time npm fails to install lunr package, in that case install lunr package manually
npm i lunr --save
  1. Add the docusaurus-lunr-search plugin to your docusaurus.config.js
module.exports = {
  // ...
    plugins: [require.resolve('docusaurus-lunr-search')],
}
  1. Then build your Docusaurus project
yarn build

or

npm run build
  1. Serve your application
yarn serve

or

npm run serve 

Note: Docusaurus search information can only be generated from a production build. Local development is currently not supported.

Using an option (eg. languages) in the plugin

module.exports = {
  // ...
    plugins: [[ require.resolve('docusaurus-lunr-search'), {
      languages: ['en', 'de'] // language codes
    }]],
}

Supports all the language listed here https://github.com/MihaiValentin/lunr-languages

Options available

Option Type Default Description
languages Array ['en'] Language codes to use for stemming, Supports all the language listed here https://github.com/MihaiValentin/lunr-languages
indexBaseUrl Boolean false Base url will not indexed by default, if you want to index the base url set this option to true
excludeRoutes Array [] Exclude certain routes from the search
includeRoutes Array [] Include only specific routes for search
stopWords Array [] Add stop words(words that are exclude from search result) to the search index
excludeTags Array [] Exclude certain tags from the search
highlightResult Boolean false Enable it to highlight the searched word in the result page. Used mark.js for highlighting.
You can customize the highlight color using css
mark { background-color: red !important; color: green !important }
disableVersioning Boolean false Docs versions are displayed by default. If you want to hide it, set this plugin option to true
assetUrl string \ Url from which the generated search doc files to be loaded, check issue #122
maxHits string 5 Maximum number of hits shown

Indexing non-direct children headings of .markdown

By default, this library will only search for headings that are direct children of the .markdown element.

If you would like to render content inside the .markdown element on a swizzled DocItem component, and want this library to index the headings inside those custom elements even if they are not direct children of the .markdown element, then add the attribute data-search-children to a parent element of the headings you want to index.

The data-search-children attribute will cause this library to look for all headings inside that element, including both direct and indirect children (E.g. 'grandchildren' nodes).

Check this issue #115 for more details.

Upgrading from docusaurus V2 to V3

Update the docusaurus-lunr-search version to 3.3.0 or higher in package.json file

Remove src/theme/SearchBar folder if you swizzled it before, if the folder does not exist then ignore this step.

Do yarn install or npm install

If npm install fails to install with error unable to resolve dependency tree, run npm i --legacy-peer-deps

Credits

Thanks to algolia/docsearch.js, I modified it to create this search component

And thanks cmfcmf, I used the code from his library docusaurus-search-local for multi-language support.

Changelog

Checkout the releases page for changelog.

docusaurus-lunr-search's People

Contributors

lelouch77 avatar praveenn77 avatar jeandcc avatar michelhmachado avatar anru avatar alanwguo avatar danielku15 avatar daddykotex avatar davidiam avatar davidmarquis avatar hinton avatar jknoxville avatar xf- avatar dependabot[bot] avatar 1natsu172 avatar soysource avatar lxix avatar tayles avatar divyabhushan avatar ipavlic avatar johannesdienst-askui avatar mateuszsikora avatar rileyabr avatar vitonsky avatar shaneog avatar wrgoldstein avatar zachjw34 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.