Offline Search for Docusaurus V2 or V3
- Docusaurus V2 or V3
- Node.js >= 12.X
- 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
- Some time npm fails to install
lunr
package, in that case installlunr
package manually
npm i lunr --save
- Add the docusaurus-lunr-search plugin to your
docusaurus.config.js
module.exports = {
// ...
plugins: [require.resolve('docusaurus-lunr-search')],
}
- Then build your Docusaurus project
yarn build
or
npm run build
- 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.
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
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 |
fields |
object |
{} |
Lunr field definitions, allows "boosting" priority for different sources of keywords (e.g. title, content, keywords) |
The fields
config property is passed into Lunr directly as field attributes, and can be used to configure the relative priority of different field types (e.g. title, content, keywords).
docusaurus-lunr-search sets the default value for fields to:
{
title: { boost: 200 },
content: { boost: 2 },
keywords: { boost: 100 }
}
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.
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
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.
Checkout the releases page for changelog.