进阶(四)：给博客添加站内搜索功能

不知不觉坚持写博客已经快一年了，博客文章破50，虽然平均每个月4到5篇不算什么，但是对于平时一心扑到工作简直没有时间生活的我来说，已经很不容易了。虽然文章可能没有高大上的标题，也没有涉及太多前沿的技术，但是起码我记录下了我的一些小经验，累积了自己的一个小知识库。其实我还有很多内容没来及的记录，希望以后能通过博客沉淀更多的知识，同时帮助到更多的人。

言归正传，文章一多，有时自己想翻查一个内容，要找好久，要是有站内查找功能就好了。于是仔细查阅了工程yml配置，果然发现在theme下的_config.yml有个local_search配置项，满心欢心把它设为true。结果搜索图标是出来了，但是点击后除了在页面加了一个全局loading就什么都没有了。看来还需要额外的操作。百度了一番，原来hexo提供了的search插件，需要手动安装才可以使用站内搜索。

3步搞定：

1.安装两个插件

npm i --save hexo-generator-search hexo-generator-searchdb

2.配置hexo主配置文件（位于工程根目录下）_config.yml

在最后面追加这段，注意2个空格的缩进，这个是yml缩进语法，不能随意。

# local_search
search:
  path: search.xml
  field: post
  format: html
  limit: 10000

3.配置hexo主题下的配置文件（位于theme->next下）_config.yml

将enable设为true。这一步我在一开始就已经做过了～

local_search:
  enable: true
  # if auto, trigger search by changing input
  # if manual, trigger search by pressing enter key or search button
  trigger: auto
  # show top n results per article, show all results by setting to -1
  top_n_per_article: 1

重新hexo g, hexo s，刷新页面，点击搜索图标，就可以看到搜索弹出框了，输入关键字，可以看到匹配到文章。

GOOD LUCK!

---

参考资料：
https://www.jianshu.com/p/519b45730824
https://github.com/wzpan/hexo-generator-search
https://www.npmjs.com/package/hexo-generator-searchdb