hexo增加搜索功能
hexo版本5.0.2 npm版本6.14.7 next版本7.8.0
作為一個(gè)博客座享,沒有搜索功能,如何在大批文章中找到自己想要的凌外,那在hexo中如何增加搜索功能呢?
search:
path: search.json
field: post
在博客目錄下安裝npm install hexo-generator-search --save
,此時(shí)使用hexo cl && hexo g
就會(huì)在博客public目錄下生成一個(gè)search.json歉备,在使用hexo d
部署上去搜索就可以用了
本地搜索弊端
前期還好,后來(lái)隨著我的文章越來(lái)越多匪燕,search.json文件已經(jīng)達(dá)到了十幾M蕾羊,每次加載頁(yè)面都需要花費(fèi)幾分鐘來(lái)加載search.json文件喧笔,使用體驗(yàn)很不好
algolia搜索
本地搜索走不通,那就只能使用遠(yuǎn)程搜索了龟再,還好hexo提供了algolia搜索
先去官網(wǎng)登錄一下书闸,這里我使用的是Github登錄,然后新建一個(gè)Index
創(chuàng)建Index后利凑,右上角頭像處點(diǎn)擊選擇Settings
查看ApiKeys
在_config.yml
中配置algolia
algolia:
applicationID: #對(duì)應(yīng)Application ID
apiKey: # 對(duì)應(yīng)Search-Only API Key
adminApiKey: # Admin API Key
indexName: # 創(chuàng)建的那個(gè)索引名稱
還需要在環(huán)境變量中配置HEXO_ALGOLIA_INDEXING_KEY 值為 頁(yè)面中Admin API Key的值
在博客目錄下安裝npm install hexo-algolia --save
之后修改使用的主題下(我使用的是next主題)的_config.yml
浆劲,配置使用algolia搜索
algolia_search:
enable: true # 開始algolia搜索
hits:
per_page: 10
labels:
input_placeholder: 查詢
hits_empty: "沒有找到任何相關(guān)結(jié)果: ${query}"
hits_stats: " ${time} ms內(nèi)找到 ${hits} 條結(jié)果"
# Local Search
# Dependencies: https://github.com/theme-next/hexo-generator-searchdb
local_search:
enable: false #關(guān)閉本地搜索
此時(shí)執(zhí)行hexo algolia
就會(huì)將博客生成的search發(fā)送到algolia中,而部署的博客就可以搜索到所上傳的內(nèi)容
這里有一個(gè)小問(wèn)題截碴,在執(zhí)行
hexo algolia
時(shí)梳侨,algolia會(huì)多條合并進(jìn)行提交,而免費(fèi)的algolia會(huì)有大小的限制日丹,可以看到超過(guò)10000字節(jié)就不行了走哺,algolia默認(rèn)會(huì)50條合并提交,可以設(shè)置幾條進(jìn)行合并使用chunkSize來(lái)設(shè)置條數(shù)哲虾,如
hexo algolia --chunkSize 10
就是10條合并字?jǐn)?shù)限制
每次都指定參數(shù)還是挺麻煩的丙躏,看一下algolia中是怎么寫的吧。
發(fā)現(xiàn)在node_modules/hexo-algolia/lib/command.js中有一個(gè)默認(rèn)配置
var CONSOLE_DEFAULTS = {
dryRun: false,
flush: false,
chunkSize: 50,
layouts: INDEXED_LAYOUTS
};
設(shè)置的chunkSize是50束凑,我由于正文內(nèi)容比較多晒旅,改成了3,這樣就不需要每次都帶參數(shù)了
參考文獻(xiàn)