博客搭建之路:hexo增加搜索功能

hexo增加搜索功能

hexo版本5.0.2 npm版本6.14.7 next版本7.8.0

作为一个博客,没有搜索功能,如何在大批文章中找到自己想要的,那在hexo中如何增加搜索功能呢?

yml 复制代码
search:
  path: search.json
  field: post

在博客目录下安装npm install hexo-generator-search --save,此时使用hexo cl && hexo g就会在博客public目录下生成一个search.json,在使用hexo d部署上去搜索就可以用了

本地搜索弊端

前期还好,后来随着我的文章越来越多,search.json文件已经达到了十几M,每次加载页面都需要花费几分钟来加载search.json文件,使用体验很不好

algolia搜索

本地搜索走不通,那就只能使用远程搜索了,还好hexo提供了algolia搜索

先去官网登录一下,这里我使用的是Github登录,然后新建一个Index

创建Index后,右上角头像处点击选择Settings

查看ApiKeys

_config.yml中配置algolia

yml 复制代码
algolia:
  applicationID: #对应Application ID
  apiKey: # 对应Search-Only API Key
  adminApiKey: # Admin API Key
  indexName: # 创建的那个索引名称

还需要在环境变量中配置HEXO_ALGOLIA_INDEXING_KEY 值为 页面中Admin API Key的值

在博客目录下安装npm install hexo-algolia --save

之后修改使用的主题下(我使用的是next主题)的_config.yml,配置使用algolia搜索

yml 复制代码
algolia_search:
  enable: true # 开始algolia搜索
  hits:
    per_page: 10
  labels:
    input_placeholder: 查询
    hits_empty: "没有找到任何相关结果: ${query}"
    hits_stats: " ${time} ms内找到 ${hits} 条结果"

# Local Search
# Dependencies: https://github.com/theme-next/hexo-generator-searchdb
local_search:
  enable: false #关闭本地搜索

此时执行hexo algolia就会将博客生成的search发送到algolia中,而部署的博客就可以搜索到所上传的内容

这里有一个小问题,在执行hexo algolia时,algolia会多条合并进行提交,而免费的algolia会有大小的限制,可以看到超过10000字节就不行了,algolia默认会50条合并提交,可以设置几条进行合并

使用chunkSize来设置条数,如hexo algolia --chunkSize 10 就是10条合并

每次都指定参数还是挺麻烦的,看一下algolia中是怎么写的吧。

发现在node_modules/hexo-algolia/lib/command.js中有一个默认配置

yaml 复制代码
var CONSOLE_DEFAULTS = {
  dryRun: false,
  flush: false,
  chunkSize: 50,
  layouts: INDEXED_LAYOUTS
};

设置的chunkSize是50,我由于正文内容比较多,改成了3,这样就不需要每次都带参数了

参考文献

相关推荐
用户47949283569153 小时前
平时都在用,但是你不知道的VS Code黑科技:智能双击选择背后的原理
程序员·visual studio code
1点东西1 天前
新来的同事问我当进程/机器突然停止时,finally 到底会不会执行?
java·后端·程序员
BertieHuang1 天前
(一)深入源码,从 0 到 1 实现 Cursor
人工智能·python·程序员
reddish1 天前
用大模型“语音指挥”网站运维?MCP + Coze 实现无代码自动化管理实战
人工智能·程序员·架构
大模型教程1 天前
LM Studio本地部署Qwen3
程序员·llm·ollama
大模型教程1 天前
dify+MCP多应用,构建灵活的AI应用生态系统
程序员·llm·mcp
AI大模型2 天前
SwanLab入门深度学习:Qwen3大模型指令微调
程序员·llm·agent
AI大模型2 天前
Anything LLM+LM Studio+SearXNG实现私有模型开启联网功能
程序员·llm·agent
程序员鱼皮2 天前
太香了!我连夜给项目加上了这套 Java 监控系统
java·前端·程序员
程序员鱼皮2 天前
这套 Java 监控系统太香了!我连夜给项目加上了
java·前端·ai·程序员·开发·软件开发