lunr module

modul lunr.js

Pencarian teks lengkap dengan indeks pra-bangun untuk Nuxt.js menggunakan lunr.js

Selama fase pembuatan Nuxt.js Anda dapat menambahkan dokumen ke pembuat indeks pencarian dengan memanggil nuxt hook lunr:document . Jika Anda telah mengonfigurasi dan meneruskan lokal yang didukung di sepanjang dokumen, indeks akan dibuat menggunakan stemmer lunr untuk bahasa yang ditentukan. Karena indeks pencarian lunr hanya menyimpan referensi ke dokumen Anda, Anda dapat memilih untuk meneruskan prop meta bersama dengan dokumen yang juga akan ditambahkan ke indeks pencarian.

Catatan Rilis

Pengaturan

1. Tambahkan ketergantungan @nuxtjs/lunr-module ke proyek Anda

$ yarn add @nuxtjs/lunr-module # or npm install @nuxtjs/lunr-module

2. Tambahkan @nuxtjs/lunr-module ke bagian modules nuxt.config.js

 {
  modules : [
    // Simple usage
    '@nuxtjs/lunr-module' ,

    // With options
    {
      src : '@nuxtjs/lunr-module' ,
      // These are the default options:
      /*
      options: {
        includeComponent: true,
        globalComponent: false,
        css: true,
        defaultLanguage: 'en',
        languages: false,
        path: 'search-index',
        ref: 'id',
        fields: [
          'title',
          'body'
        ]
      } */
    }
  ]
} 

Dokumentasi

Menambahkan dokumen ke indeks pencarian

Tambahkan dokumen dengan memanggil nuxt hook lunr:documents sebagai berikut:

 const document = {
  id : 1 ,
  title : 'My Title' ,
  body : 'The body'
}

const meta = {
  href : '/link/to/page' ,
  title : document . title
}

nuxt . callHook ( 'lunr:document' , ( {
  locale : 'af' , // optional, default en
  document ,
  meta // optional
} ) 

Dukungan lokal

Dengan mengonfigurasi opsi lokal, Anda dapat menunjukkan bahasa apa yang didukung yang harus dibuat indeks pencariannya. Jika Anda meneruskan lokal lain dengan suatu dokumen, maka itu akan ditambahkan ke indeks pencarian defaultLanguage (dan peringatan akan dicetak).

Berbagai bahasa sama dengan beberapa indeks pencarian

Bahasa Inggris didukung secara default di Lunr, ketika Anda hanya memiliki dokumen berbahasa Inggris, Anda tidak perlu mengkonfigurasi atau meneruskan lokal apa pun.

Bahasa vs Lokal

Lokal dapat terdiri dari satu bahasa saja atau mencakup suatu wilayah, Anda dapat menggunakan salah satu dari keduanya. Jadi keduanya hanya bahasa (misalnya nl ) serta menyertakan wilayah (misalnya nl_NL ) akan berfungsi

integrasi nuxt-i18n

Jika modul ini mendeteksi proyek Anda menggunakan nuxt-i18n maka lokal yang dikonfigurasi untuk nuxt-i18n akan ditambahkan secara otomatis. Anda tidak perlu mengkonfigurasi lokal yang Anda gunakan dua kali kecuali Anda ingin menggunakan lokal yang berbeda (misalnya hanya satu) untuk indeks pencarian.

Tambahkan komponen pencarian ke situs web Anda

Modul ini mencakup komponen pencarian yang dapat Anda gunakan di situs web Anda. Gunakan slot defaultnya untuk menampilkan hasil pencarian Anda menggunakan properti yang diteruskan dalam meta prop

< template >
  < lunr-search : lang = " lang " >
    < template v-slot : default = " { result, index, maxScore, meta } " >
      < nuxt-link : to = " meta . href " >
        {{ meta . title }}
        < span >score: {{ Math . round ( 100 * result . score / maxScore) }}%</ span >
      </ nuxt-link >
    </ template >
  </ lunr-search >
</ template >

< script >
export default {
  components : {
    // Note: 'lunr-module' below is a custom webpack alias and
    // does NOT refer to the folder in node_modules
    LunrSearch : () => import ( ' lunr-module/search ' )
  }
}
</ script > 

Pertimbangan kinerja

Gunakan bilangan bulat sebagai referensi dokumen

Referensi dokumen (ditentukan oleh option.ref) digunakan dalam indeks pencarian untuk menghubungkan semua segmen kata yang berasal. Jika Anda misalnya menggunakan jalur halaman sebagai referensi dokumen, maka untuk halaman dengan jalur /en/offices/emea/nl/contact nilai string tersebut akan digunakan untuk menghubungkan semua segmen kata yang berasal. Hal ini dapat meningkatkan ukuran indeks pencarian secara besar-besaran, oleh karena itu disarankan untuk membuat referensi dokumen numerik dan menggunakan properti meta untuk menambahkan jalur halaman untuk referensi dokumen tersebut hanya sekali ke indeks pencarian.

Muat komponen pencarian secara dinamis

Lunr tidak mengekspor modul ES6 dan tidak dapat diguncang. Menggunakan modul ini menambahkan ~8.5KB + ~2KB untuk setiap bahasa selain bahasa Inggris ke paket Anda (gzip). Lihat contoh di atas untuk impor dinamis yang memastikan impor lunr tidak disertakan dalam paket vendor Anda

Perhatikan ukuran indeks pencarian secara umum

Indeks pencarian disimpan sebagai file json dan karenanya perlu diuraikan di klien. Jika json indeks pencarian Anda menjadi sangat besar, ini bisa menjadi masalah pada klien (seluler). Misalnya Safari di iOS membatasi setiap titik masuk tingkat atas untuk berjalan maksimal 10 detik. Lihat masalah Lunr.js ini untuk kemungkinan solusinya.

Referensi

Pilihan

termasuk Komponen

• ketik Boolean
• standarnya true

Jika benar maka komponen pencarian default akan ditambahkan ke proyek Nuxt Anda

Anda dapat mengimpor komponen menggunakan webpack alias lunr-module/search

Komponen global

• ketik Boolean , String
• bawaan false

Jika benar maka sebuah plugin akan ditambahkan ke proyek Anda yang menginstal komponen pencarian secara global

Menyetel opsi ini berarti includeComponent: true

Secara default komponen pencarian akan didaftarkan sebagai lunr-search , jika Anda menginginkan nama ini, Anda dapat mengatur opsi ini ke string dengan nama yang ingin Anda gunakan

  globalComponent : 'my-global-lunr-search'
. . .
< template >
  < my-global-lunr-search : lang = "lang" class = "my-search" / >
< / template > 

css

• ketik Boolean
• standarnya true

Jika komponen pencarian disertakan, opsi ini menentukan apakah gaya css default harus disertakan atau tidak

Bahasa default

• ketik String
• 'en'

Bahasa default yang digunakan. Ini juga merupakan bahasa pengganti jika Anda meneruskan dokumen dengan lokal yang tidak didukung

bahasa

• ketik String , Array
• default undefined

String atau larik bahasa yang indeks pencariannya perlu dibuat.

Meskipun opsi ini mungkin tampak mubazir (yaitu mengapa tidak membuat indeks pencarian untuk setiap bahasa yang dilewati), opsi ini memberikan pemeriksaan untuk mencegah dokumen 'nakal' diindeks ke dalam indeks terpisah.

bahasaStemmerMap

• ketik Object
• bawaan {}

Sebuah objek yang berisi peta bahasa yang tidak didukung ke bahasa asal yang didukung (oleh lunr). Gunakan ini untuk menentukan bahasa induk mana yang harus digunakan jika Anda ingin membuat indeks pencarian untuk bahasa yang (belum) didukung oleh lunr.

jalur

• ketik String
• search-index default

Saat membangun proyek Anda, indeks pencarian yang dibuat akan dikeluarkan sebagai aset webpack. Opsi ini menentukan jalur di bawah nuxt.publicPath yang harus digunakan.

Dengan konfigurasi default untuk Nuxt.js dan modul ini, indeks pencarian bahasa Inggris tersedia di /_nuxt/search-index/en.json

referensi

• ketik String
• id bawaan

Nama properti dalam dokumen Anda yang menentukan referensi apa yang harus digunakan untuk dokumen ini dalam indeks pencarian

bidang

• ketik Array
• default ['title', 'body']

Nama properti di dokumen Anda yang akan diindeks

placeholderTeks

• ketik String
• Search bawaan

Teks yang ditempatkan di placeholder kolom input pencarian. Jika Anda menggunakan nuxt-i18n, Anda juga dapat memberikan terjemahan dengan kunci lunr-module.placeholderText

statusPesan

• ketik Array<String>
• default { fetching: 'Fetching search index', loading: 'Loading search index', searching: 'Searching...', noresults: 'No results found' }

Pesan status yang ditampilkan selama siklus hidup pencarian. Jika Anda menggunakan nuxt-i18n, Anda juga dapat memberikan terjemahan dengan key lunr-module.${key} . Misalnya gunakan lunr-module.noresults untuk memberikan terjemahan untuk status tidak ada hasil yang ditemukan.

Kait (Mendengarkan)

gunakan nuxt.callHook(<name>, <arg>) jika Anda ingin menggunakan kait ini

lunr:dokumen

• arg: ({ locale?, document, meta? })

Kait utama yang digunakan untuk menambahkan dokumen ke indeks pencarian. Anda harus meneruskan objek seperti yang dijelaskan. Baik lokal maupun meta bersifat opsional. Jika tidak ada lokal yang diteruskan, Bahasa defaultLanguage akan digunakan

Kait (Memancarkan)

gunakan nuxt.hook(<name>, <callback>) jika Anda ingin menggunakan kait ini. Fungsi panggilan balik menerima argumen yang terdaftar

lunr:index:beforeCreate

• arg: ({ locale, builder })

Gunakan pengait ini jika misalnya Anda ingin mendaftarkan plugin lunr khusus

Hook ini dipanggil setelah pembuat lunr dibuat tetapi sebelum plugin bahasa ditambahkan atau referensi dan kolom apa pun disetel

lunr:index:dibuat

• arg: ({ locale, builder })

Gunakan pengait ini jika misalnya Anda ingin menambahkan dokumen tambahan ke indeks

Hook ini dipanggil ketika pembuat lunr telah diatur, tepat sebelum dokumen ditambahkan ke indeks.

lunr:indeks:selesai

• arg: ({ locale, builder, index })

Gunakan pengait ini jika Anda ingin berinteraksi dengan indeks sebelum mengekspornya

Kait ini dipanggil tepat sebelum indeks diekspor sebagai objek json

lunr: aset

• arg: ({ locale, json })

Gunakan kait ini jika Anda ingin memanipulasi json yang dipancarkan sebagai indeks pencarian untuk lokal

Kait ini dipanggil selama kompilasi webpack tepat sebelum indeks pencarian disiapkan untuk dikeluarkan sebagai aset

Perkembangan

1. Kloning repositori ini
2. Instal dependensi menggunakan yarn install atau npm install
3. Mulai server pengembangan menggunakan npm run dev

Lisensi

Lisensi MIT

Hak Cipta (c) pimlie