Lunr.js Indexierung?

Question

Ich habe vor kurzem ein Web-Projekt gestartet, wo ich eine Suchschaltfläche für die Suche auf meiner Website implementieren muss, aber clientseitig. Also habe ich lunr.js gefunden. Mein Problem ist .. Wie indexiere ich die Seiten? Ja, ich kenne die Übung, die auf ihrer Website geschrieben wurde. Allerdings ist es nicht klar genug. Wo implementiere ich das Skript? (siehe unten) Was benutze ich?

var index = lunr(function() { 
    this.field('title', {boost: 10}) 
    this.field('body') 
    this.ref('id') 
}) 

index.add({ 
    id: 1, 
    title: 'Foo', 
    body: 'Foo foo foo!' 
}) 

index.add({ 
    id: 2, 
    title: 'Bar', 
    body: 'Bar bar bar!' 
}) 

Wo gebe ich diesen Code ein? Ich habe eindeutig keine Ahnung.

Answer 1

Willkommen bei Stack Overflow!

Das Snippet, das Sie erstellt haben, erstellt einen Index und fügt dem Index Dokumente hinzu. Ein Index ist das Objekt, für das Sie suchen. Er speichert die hinzugefügten Dokumente so, dass die Volltextsuche möglich ist.

Sie sollten diesen Code (aber Hinzufügen der Dokumente, die Sie durchsuchen möchten) auf jeder Seite, die Sie Ihre Suchfunktion bereitstellen möchten.

Dann müssen Sie den Benutzer eine Art von UI bereitzustellen, so dass die Suche durchzuführen:

<input type="search" id="search-input" placeholder="Search"> 

Jetzt wollen Sie eine Suche gegen lunr auszuführen, wenn der Benutzer in das Suchfeld:

var searchInput = document.querySelector('#search-input') 
searchInput.addEventListener('keyup', function() { 
    var results = index.search(searchInput.value) 
    // do something with the results (maybe display them) 
}) 

Das oben genannte ist wirklich einfach, aber hoffentlich ist genug, um Sie zu beginnen. Sie können ein anderes Beispiel in der Verwendung auf dem lunr docs page