使用 Lunr.js 在 DocFX 中实现搜索功能

要在 docfx 中使用 Lunr.js 搜索，您需要执行以下步骤：

安装 Lunr.js：您可以通过运行以下命令来安装 Lunr.js：

npm install lunr

创建一个搜索索引：在您的 docfx 项目中，您需要创建一个用于搜索的索引文件。您可以创建一个 JavaScript 文件，将其命名为 'searchIndex.js'，并将其放在您的 docfx 项目的根目录中。在该文件中，您需要执行以下操作：

引入 Lunr.js：

var lunr = require('lunr');

创建一个 Lunr.js 搜索索引：

var index = lunr(function () {
  this.field('title', { boost: 10 });
  this.field('content');
  this.ref('href');
});

将您的文档数据添加到搜索索引中：

// 假设您有一个名为 docs 的数组，其中包含了您的文档数据
docs.forEach(function (doc) {
  index.add(doc);
});

将搜索索引导出为一个全局变量：

// 假设您将搜索索引导出为一个名为 searchIndex 的全局变量
window.searchIndex = index;

配置 docfx 以使用 Lunr.js 搜索：在您的 docfx 项目的 'docfx.json' 文件中，找到 'build' 部分，并将其配置为使用 Lunr.js 搜索。在 'build' 部分中，添加以下配置：

"globalMetadata": {
  "search": "lunr"
}

添加搜索框：在您的 docfx 项目的适当位置，将以下 HTML 代码添加到您的 HTML 文件中，以显示搜索框：

<input type="text" id="search-box" placeholder="Search">
<div id="search-results"></div>

创建搜索功能：在您的 HTML 文件中，添加以下 JavaScript 代码，以实现搜索功能：

var searchBox = document.getElementById('search-box');
var searchResults = document.getElementById('search-results');

searchBox.addEventListener('input', function () {
  var query = searchBox.value;
  var results = window.searchIndex.search(query);

  searchResults.innerHTML = '';

  results.forEach(function (result) {
    var link = document.createElement('a');
    link.href = result.ref;
    link.textContent = result.ref;
    searchResults.appendChild(link);
  });
});

现在，当用户在搜索框中输入内容时，您的 docfx 项目将使用 Lunr.js 搜索来搜索文档，并将搜索结果显示在 'search-results' 元素中。