Hexo-平平无奇总结贴

​ 本人乃平平无奇的全栈小菜鸡,并非妥妥的颜值控,博客的构建亦为兴趣驱动,看到好玩的点就会想去尝试,从而一步步构建自身的一人之境。在这个探索过程中我也逐步戒掉了手机和其他社交网络的纷扰,不再是被动接收各种“花路推荐”,而是倾向主动去发现和探索自己想要了解的领域并记录所感、所知、所得。

滴滴滴

​ 万恶的n次电脑故障把俺的资料都清了,😂在之前的项目迁移、数据处理的过程中由于部分项目内容和资源等信息等没有及时做好同步备份😥,于是抽空基于现有的笔记和学习习惯重新折腾博客并梳理学习资源以便于随时复盘和巩固。随着项目迭代升级,发现嵌入的东西也越来越多,此处整体梳理一下个人知识库构建记录过程,便于后续维护和迭代,结合知识库维护不定时更新😜~

​ 本篇总结了个人在构建知识库时所引用到的知识点、技术栈等内容,并相应梳理了在构建过程中遇到的一些问题和解决方案,小伙伴们可有需自取🤯~ 在构建的过程中或许会遇到这样那样的问题,主动发现、提问并解决的过程是很有意义的。不管如何,起步虽易、坚持很难,最重要的是在构建的过程中能够学有所成、学有所思并学以致用🧐

​ 如果你也是一个技术or生活分享家,你会发现这是一个毫无感情的技术记录贴,可以帮助你如何快速构建个人知识库并提供在这个过程中可能会遇到的问题的一些解决思路和方案;如果你是一个UI艺术家,个人建议可以移步围观魔改大佬们的个人主页和发展历程(包括但不限于Akilar店长Heo小冰博客贰猹的小窝等),或许你可以直接引用大大们提供的资源文件一步到位,但有时候有些东西得之较易则索然无味、反而可能不会去好好珍惜。个人建议想学技术的小伙伴们最好是自己动手丰衣足食,很多时候大大们更多的也是希望“授人以鱼不如授人以渔”,在摸索的过程最重要的是一步一步脚印,把主动权控制在自己的手上,勿忘初心、方得始终!

​ 部分文档内容会随着项目迭代维护不定时更新,如果文档中有问题或者不明确的地方欢迎在评论区提出或者发送邮箱🎉,一起学习、一起进步。与此同时也非常感谢各位大大们的用爱发电和技术分享✨~,也希望能够帮助路过的小伙伴快速垂直入坑。

强迫症警告

图片资源引用问题

1.相对路径的引用方式是一直以来构建的习惯,将文章和图片资源存储到同级目录下分门别类进行存储,便于后续的组织和归档,对此hexo也提供了相应的方案解决(资源文件夹、插件转化等,还有通过”快捷方式”这种概念将路径指向真正的资源库),但随着博客项目的迭代,在项目中存储图片资源可能造成项目臃肿

2.图床构建方式虽然方便图片资源迁移和引用,但对于我来说如果要将文章和资源分门别类则会耗费些许时间,且第三方的不确定性可能在某种程度上也暗戳戳地劝退着我。

3.不管如何,萝卜青菜各有所爱,选择最适配的方案

1.基础篇

​ 快速构建一个简单的hexo项目需要做什么?

1
2
3
1.开发环境准备:node、git
2.部署环境:github/gitee/coding等、云服务器(可选)
3.笔记构建工具:markdown编辑器

​ 参考文章:

2.插件篇

​ 下述简单列举个人在项目构建过程中所接触的一些插件,仅供参考,更多插件库可参考plugins

插件参考

【基础】项目部署相关(更多部署插件参考官方提供:hexo-deployer-xxx)

【推荐】一些好用的基础插件

【推荐】后台管理相关

hexo-adminhexo-admin-ehchexo-hey

【推荐】后台管理相关

hexo-offline-popup:该插件基于停止维护已久的hexo-service-worker进行改造,用于加速Hexo网站的加载速度,以及网站内容更新弹窗提示

【推荐】hexo-baidu-url-push

​ 自动推送是百度站长平台为提高站点新增网页发现速度推出的工具,安装自动推送JS代码的网页,在页面被访问时,页面URL将立即被推送给百度

​ 类似的还有baidu_url_submit

【推荐】【私有篇】

【推荐】hexo-feed

​ 为hexo站点构建RSS、Atom、JSON提要

​ 类似插件:hexo-generator-feed

【可选】【资源文件处理相关】hexo-asset

​ 一个辅助的文章图片资源转化的参考解决方案。我接触它的场景是基于typora构建的本地图片资源引用和hexo图片引用的兼容问题,可以试着通过这种方式转化图片的路径(或者自定义插件),但考虑到存量笔记的迁移和整理工作量的问题,部分的笔记梳理我调整为图床方式构建

【可选】【资源文件处理相关】hexo-asset-pipeline hexo-all-minifier

​ 静态资源压缩处理

【可选】【SEO优化相关】hexo-autonofollow

​ 自动为博客中的外链添加rel="external nofollow noreferrer",进而改善网站安全性&SEO,并为外部链接控制打开方式为新窗口或者选项卡

​ 类似的插件有hexo-filter-nofollow

【可选】【SEO优化相关】hexo-generator-seo-friendly-sitemap

​ 网站地图文件生成,用于seo优化

【可选】hexo-butterfly-charts

​ 将 hexo posts、类别和标签的统计数据呈现到图表中。类似还有许多将图表嵌入到页面中的插件:hexo-calendar

【可选】【娱乐侧】一些娱乐向的信息嵌入插件

Other

【可选】hexo-admonition

​ Hexo 内容辅助插件(一个扩展的提示框),支持将类似 reStructuredText 的警告提示块添加到 Markdown 文档中。例如 note、warning、error 等提示块

​ 作者开发这个插件的动机是想让 hexoMaterial for MkDocs 的提示信息兼容,让系列文章在基于 MkDocs 搭建的子站中有更好的阅读体验

【可选】hexo-auto-category

​ 通过front-matter的方式指定文章的分类类别,通过这个插件自动根据目录/文件夹名称相应生成静态页面(大部分主题均嵌入了相关分类,具体可参考相应主题的分类说明)

【可选】hexo-auto-excerpthexo-excerpt

​ 自动摘录:hexo提供了<!-- more -->标签可摘录文章(类似在指定的位置截断),此处可通过该插件以配置参数的形式限定摘录参数

【可选】hexo-auto-link-checker

​ 链接检查器:每次执行$ Hexo S时,链接检查系统会自动搜索一篇文章的链接。如果外部链接、内部链接和TOC无效,则相应显示在控制台消息中。解析后的链接缓存在/ hexo-auto-link-checker.json中

​ 类似插件: hexo-broken-links-checker(除却基本的外链检查,可将外链检查定位到不同标签中的外链引用,例如a、img等等)

【可选】hexo-autolinker

​ url转换器:(emm….typora快捷键ctrl+k也挺香的其实)

1
2
3
4
即将这种调调
Visit www.codeblocq.com when you have time.
转化为这种调调
Visit <a href="http://www.codeblocq.com" target="_blank">www.codeblocq.com</a> when you have time.

【可选】hexo-auto-issue

​ 可自动将文章发布到github issue上,通过配置的方式指定文件发布,支持排序

【可选】hexo-azuresearch

​ Azure Search搜索服务构建,一般无特别需求可引用主题提供的搜索嵌入(例如本地搜索、algolia等),搜索服务相当于一个数据仓用于存储站点相关的文章信息。Azure Search的搜索与algolia类似也是依托于用户创建索引&主动上传相关信息(而非其主动检索站点概念),主要区别在于一些配置项和数据格式相关

​ 可参考文章介绍,类似插件有hexo-generator-search

【可选】hexo-recommended-posts

​ hexo跨博客文章推荐插件 ,可以从推荐引擎中获取文章推荐列表(可包含自己和外部的文章链接),使用该服务的博主之间可以实现文章互推(但相应需关闭原有引擎的自动推送机制)

【可选】hex-github系列:用于展示github相关数据

3.扩展篇

​ 在实践的过程中会结合自身的一些编写习惯和所需,参考一些组件的实现,尝试着自己去扩展一些插件的应用。为了统一对插件进行管理,将功能糅合到一个组件中进行升级迭代,也便于后续的跟踪维护

自定义标签插件