39 lines
940 B
Markdown
39 lines
940 B
Markdown
|
+++
|
||
|
|
date = "2021-07-02"
|
||
|
|
tags = ["hugo"]
|
||
|
|
title = "hugoでsearchするやつ付けてみた"
|
||
|
|
slug = "hugo-search"
|
||
|
|
+++
|
||
|
|
|
||
|
|
[/search](/search)
|
||
|
|
|
||
|
|
記事を検索したい場合、自分はcontent/postをgrepするだけなので、あまり使わないのですが、一応、webにも検索フォームを付けてみました。
|
||
|
|
|
||
|
|
hugo + vue + lunr.jsです。
|
||
|
|
|
||
|
|
ただ、日本語はおそらく対応してない。対応するには日本語対応するためのlibを追加で読み込む必要がありそう。
|
||
|
|
|
||
|
|
lunrに渡すdataは、hugoがjson出力できるので、それを使います。
|
||
|
|
|
||
|
|
```toml:config.toml
|
||
|
|
[outputs]
|
||
|
|
home = ["JSON", "HTML"]
|
||
|
|
```
|
||
|
|
|
||
|
|
jsはこんな感じで(要点記述だけですが)。
|
||
|
|
|
||
|
|
```js:static/script.js
|
||
|
|
axios('/index.json')
|
||
|
|
|
||
|
|
this.searchIndex = lunr(function () {
|
||
|
|
this.ref('href')
|
||
|
|
this.field('contents')
|
||
|
|
this.field('title')
|
||
|
|
this.field('tags')
|
||
|
|
documents.forEach(doc => {
|
||
|
|
this.add(doc)
|
||
|
|
})
|
||
|
|
}
|
||
|
|
```
|
||
|
|
|