The Search Engine provides indexing and search functionality for documentation websites.
Singleton class providing search indexing and JSON generation for client-side search.
/**
* Search indexing engine for documentation websites
* Uses singleton pattern - access via SearchEngine.getInstance() or default export
*/
class SearchEngine {
// Public instance properties
searchIndex: any;
documentsStore: Object;
indexSize: number;
amountOfMemory: number;
/**
* Get singleton instance of SearchEngine
* @returns SearchEngine instance
*/
static getInstance(): SearchEngine;
/**
* Index a page for search functionality
* @param page - Page data to index including content and metadata
*/
indexPage(page: any): void;
/**
* Generate search index JSON file for client-side search
* @param outputFolder - Directory to write the search index
* @returns Promise resolving when search index is generated
*/
generateSearchIndexJson(outputFolder: string): Promise<any>;
}Usage Examples:
import SearchEngine from "@compodoc/compodoc";
// or
// import { SearchEngine } from "@compodoc/compodoc";
// const engine = SearchEngine.getInstance();
// Using the default export (already an instance)
const pageData = {
infos: {
name: "AppComponent",
id: "app-component",
context: "component"
},
rawData: "<h1>AppComponent</h1><p>Main application component</p>",
url: "/components/AppComponent.html"
};
SearchEngine.indexPage(pageData);
// Generate search index after indexing all pages
await SearchEngine.generateSearchIndexJson("./documentation");Structure for page data that gets indexed for search.
interface SearchPageData {
/**
* Page metadata and information
*/
infos: {
name: string;
id: string;
context: string;
depth?: number;
pageType?: string;
};
/**
* Raw HTML content of the page
*/
rawData: string;
/**
* URL path to the page
*/
url: string;
}Structure of the generated search index JSON file.
interface SearchIndex {
/**
* Lunr.js search index data
*/
index: any;
/**
* Store of searchable documents
*/
store: SearchDocument[];
}
interface SearchDocument {
/**
* Unique document identifier
*/
id: string;
/**
* Document title/name
*/
title: string;
/**
* Document content for search
*/
body: string;
/**
* Document URL for navigation
*/
url: string;
/**
* Document type/context
*/
type: string;
}Methods for integrating search functionality into documentation websites.
/**
* Search functionality configuration
*/
interface SearchConfiguration {
/**
* Enable/disable search functionality
* @default false when Configuration.mainData.disableSearch is true
*/
enabled: boolean;
/**
* Maximum number of search results to display
* @default 15
*/
maxResults: number;
/**
* Search index file path
* @default "js/search/search_index.json"
*/
indexPath: string;
}Usage Examples:
// Configure search in main configuration
const config = Configuration.getInstance();
config.mainData.disableSearch = false;
config.mainData.maxSearchResults = 25;
// Index multiple pages
const pages = [
{ infos: { name: "Overview", id: "overview", context: "page" }, rawData: "...", url: "/index.html" },
{ infos: { name: "AppModule", id: "app-module", context: "module" }, rawData: "...", url: "/modules/AppModule.html" },
{ infos: { name: "AppComponent", id: "app-component", context: "component" }, rawData: "...", url: "/components/AppComponent.html" }
];
pages.forEach(page => SearchEngine.indexPage(page));
// Generate final search index
await SearchEngine.generateSearchIndexJson("./documentation");JavaScript code structure for client-side search functionality.
// Client-side search implementation structure
class DocumentationSearch {
constructor(indexPath, maxResults) {
this.indexPath = indexPath;
this.maxResults = maxResults;
this.index = null;
this.store = null;
}
async initialize() {
// Load search index
const response = await fetch(this.indexPath);
const data = await response.json();
this.index = lunr.Index.load(data.index);
this.store = data.store;
}
search(query) {
if (!this.index) return [];
const results = this.index.search(query);
return results
.slice(0, this.maxResults)
.map(result => {
const doc = this.store.find(d => d.id === result.ref);
return {
...doc,
score: result.score
};
});
}
}Configuration for the Lunr.js search library used by Compodoc.
interface LunrConfiguration {
/**
* Fields to index for search
*/
fields: {
title: { boost: number }; // Title field with boosting
body: { boost: number }; // Body content field
type: { boost: number }; // Document type field
};
/**
* Reference field for document lookup
*/
ref: "id";
/**
* Pipeline functions for text processing
*/
pipeline: string[];
/**
* Search field configuration
*/
searchPipeline: string[];
}Usage Examples:
// Custom search configuration example
const searchConfig: LunrConfiguration = {
fields: {
title: { boost: 10 }, // Higher boost for titles
body: { boost: 1 }, // Normal boost for content
type: { boost: 5 } // Medium boost for types
},
ref: "id",
pipeline: ["stemmer", "stopWordFilter"],
searchPipeline: ["stemmer"]
};