Jekyll で日本語検索に対応する

本サイトで導入している Jekyll テーマ Just The Docs で、日本語検索ができなかったので対応する。

Step 1.

/assets/js/vendor/ 配下に、以下の js ファイルを設置する。
※ファイル自体は lunr-languages (GitHub) からコピペで持ってくる。

lunr.stemmer.support.min.js
lunr.ja.min.js
tinyseg.js

Step 2.

_includes/head_custom.html に以下を記述する。

{% if site.search_enabled != false %}
    <script type="text/javascript" src="{{ '/assets/js/vendor/lunr.stemmer.support.min.js' | absolute_url }}"></script>
    <script type="text/javascript" src="{{ '/assets/js/vendor/tinyseg.js' | absolute_url }}"></script>
    <script type="text/javascript" src="{{ '/assets/js/vendor/lunr.ja.min.js' | absolute_url }}"></script>
{% endif %}

<script> タグの読み込み順序注意！

Step 3.

assets/js/just-the-docs.js にある var index = lunr(function(){ のすぐ下の行に this.use(lunr.ja); を追記する。
以下の感じで：

var index = lunr(function(){
    
        this.use(lunr.ja); // ←これを追記
        
        this.ref('id');
        this.field('title', { boost: 200 });
        this.field('content', { boost: 2 });
        {%- if site.search.rel_url != false %}
        this.field('relUrl');

出力結果

できた。 result image

補足

複数言語対応として、こちら の方法を試したが、日本語だとうまくいかず沼った。ロシア語など他の言語ではできるようだが、、

this.use(lunr.multiLanguage('en', 'ru') );

どうやら js の既知問題らしい。

参考