明日方舟罗德岛阵营的 Hexo 主题，支持数学公式

| 简体中文 | English | 日本語

hexo-theme-arknights 预览 Dr.Yue_plus: http://arknights.theme.hexo.yue.zone/ Dr.ToUNVRSe https://tounvrse.github.io/ Dr.Ye: https://laurenfrost.github.io/ Dr.LingYun: https://dr-lingyun.gitee.io/ Dr.XIMU：http://b.ligzs.cn/ Dr.tyqtyq https://tyq0712.github.io/ Dr.Ryo https://blog.ryo-okami.xyz/ Dr.TTsdzb https://ark.ttsdzb.monster/ Dr.Tanle https://ztblog.work/ Dr.Sherkey https://blog.sherkey.ml/ Dr.Angine https://angine.tech/

如果使用了这个主题，欢迎在这儿贴预览链接~

安装 环境 Node.js 16.13.x 以上 最新版 Hexo

Hexo 6.0.0 以上； hexo-cli 4.3.0 以上；

中国大陆用户推荐使用 cnpm 安装依赖包，参考 中国 NPM 镜像 使用 hexo-cli 新建博客项目：

hexo init Hexo cd Hexo cnpm install git clone https://github.com/Yue-plus/hexo-theme-arknights.git themes/arknights 安装依赖

npm 用户：

cnpm install hexo-server hexo-browsersync hexo-renderer-pug --save

yarn 用户：

yarn add hexo-server hexo-browsersync hexo-renderer-pug 修改配置文件

参照 Hexo 官网 修改 Hexo/ 目录下的 _config.yml。

把 theme: 的值改为 arknights 开启代码高亮：

highlight: hljs: true

剪切 Hexo/themes/arknights/_config.yml 到 Hexo 目录下，并重命名为 _config.arknights.yml。

建议参考：

使用代替主题配置文件

主题的配置文件可参照中文注释修改。

修改资源文件

可按需在 Hexo/source/ 目录添加以下文件

CNAME: GitHub Pages 部署时的自定义域名 img/ 目录下的 Alipay.png 与 WeChat.png 为自己的收款二维码（1:1 比例的 png 图片）；

可按需修改 Hexo/themes/arknights/source/ 目录下的

favicon.ico：浏览器标签页上的图标（64*64，分辨率高了显示不出） README.md: 部署仓库的 README 写作 参考 Hexo | 写作。 在主题仓库的 Hexo 分支有一些 示例文本可以取用 添加文章标签与分类，更多特性可参考 Hexo | Front-matter ，示例：

--- title: 'Hello World !' date: 2020-04-15 21:54:02 tags: code category: Example --- 在 <!-- more --> 之前的内容称之为摘要，会显示在首页上，并且可以设置是否也在正文显示。

主题添加了一些 标签插件 可在写作中使用。

在导航栏中添加页面 例如：新建一个 about 页面 在 Hexo 目录下执行

hexo new page 'about' 然后 Hexo/source/ 目录下会多一个 about 文件夹 编辑 Hexo/source/about/index.md 文件 编辑 _config.arknights.yml，添加一个链接：

menu: About: /about 禁止归档页翻页

该设置位于 Hexo 配置文件 _config.yml 约第 92 行。

## Set per_page to 0 to disable pagination per_page: 10

改为 0 即可。

评论系统 Valine

本主题支持Valine 。 请参考 Valine 快速开始 修改 Hexo 目录下的 _config.arknights.yml 文件：

valine: enable: false app_id: # APP ID app_key: # APP KEY server_url: # APP DOMAIN（LeanCloud 国际版）

开启邮件提醒：zhaojun1998 / Valine-Admin

注意！ 当 Valine 使用 LeanCloud 国际版 时，才需要配置 server_url:。
该设置可在 LeanCloud 应用中的 设置 -> 应用凭证 -> 域名白名单 -> Request 域名 中找到以 .api.lncldglobal.com 结尾的域名，加上 https:// 前缀即可。

Gitalk

本主题支持 Gitalk 。 请参考 gitalk/readme-cn.md 修改 Hexo 目录下的 _config.arknights.yml 文件：

gitalk: enable: false client_id: # GitHub 应用 Client ID client_secret: # GitHub 应用 Client Secret repo: # 用于存放评论数据的 GitHub 仓库 owner: # 该 GitHub 仓库所有者 admin: [] # 具有写该 GitHub 仓库权限的用户 # 例如: [adminA,adminB] id: # (可选) 页面的唯一标识 # 例如: location.pathname Waline

本主题支持 Waline 。
请参考 Waline官方文档 修改 Hexo 目录下的 _config.arknights.yml 文件:

waline: enable: false server_url: #Server_Url 数学公式

本主题支持两种方案显示数学公式：

方案一：静态渲染

可以使用 hexo-filter-mathjax Hexo 过滤器静态渲染，来显示数学公式：

在 Hexo 目录下执行以下指令：

# 安装 hexo-filter-mathjax 插件 cnpm install hexo-filter-mathjax --save # 清除缓存 hexo clean 把以下内容添加到 Hexo/_config.yml 文件：

mathjax: tags: none # 或 'ams' 或 'all' single_dollars: true # 启用单个美元符号作为内联（行内）数学公式定界符 cjk_width: 0.9 # 相对 CJK 字符宽度 normal_width: 0.6 # 相对正常（等宽）宽度 append_css: true # 将 CSS 添加到每个页面 every_page: false # 如果为 true，那么无论每篇文章的前题中的 `mathjax` 设置如何，每页都将由 mathjax 呈现 在需要启用 mathjax 的文章的 Front-matter 区内添加 mathjax: true：

--- title: On the Electrodynamics of Moving Bodies categories: Physics date: 1905-06-30 12:00:00 mathjax: true ---

然后，就可以在文章中使用 LaTeX 语法。

需要注意，内联数学公式（…… $<数学公式>$ ……）在开头 $ 之后和结尾 $ 之前不能有空格！例如：

-$ \epsilon_0 $ +$\epsilon_0$ -$ \frac{\partial}{\partial t} $ +$\frac{\partial}{\partial t}$ 需要注意 LaTeX 与 Markdown 语法之间的冲突。如有必要，请使用 \ 进行转义：

-$\epsilon_0$ +$\epsilon\_0$ -\begin{eqnarray*} +\begin{eqnarray\*}

或是更换能更好处理数学公式的渲染器 hexo-renderer-pandoc。

方案二：动态渲染

本主题也支持 MathJax ，在用户浏览时动态渲染公式：

首先要卸载 Hexo 默认自带的 hexo-renderer-marked 渲染器，更换成对 MathJax 支持更好的 hexo-renderer-kramed 渲染器：

npm uninstall hexo-renderer-marked --save npm install hexo-renderer-kramed --save 修改 Hexo 目录 下的 _config.arknights.yml 文件：

# 公式支持 mathjax: - enable: false + enable: true version: '2.6.1' # 重要 然后，就可以在文章中使用 LaTeX 语法：

% 单行内联公式 % 注意需要两边带上 "`" ，且 "`" 与 "$" 之间不能有空格 `$\sigma$` % 多行公式 $$ \begin{aligned}f(x) &= \sum_{i=1}^{\infty}{\frac{x}{2^i}} \\ &= x\end{aligned} $$ 用这种方案，不会造成 LaTeX 与 Markdown 语法之间的冲突。在文中使用 LaTeX 语法不需要转义。 以下公式可以直接使用，不会造成任何问题：

\epsilon_0 \begin{eqnarray*}

hexo-renderer-kramed 插件还有其他可配置项，请参考插件文档： https://github.com/sun11/hexo-renderer-kramed

几种公式显示方案各有优缺点：

动态渲染方案 LaTeX 语法不需要转义，能更好的支持从其他地方导出的 Markdown 文件。但因为需要在浏览器渲染，页面显示会略有延迟。 静态渲染方案将公式直接编译在静态文件里，显示性能更优，但语法需要转义。 图表支持

修改 Hexo 目录 下的 _config.arknights.yml 文件：

# 图表支持 mermaid: - enable: false + enable: true version: '8.13.5'

主题通过 mermaid-js 绘制各种图表。查看示例

支持： 流程图 | 序列图 | 类图 | 状态图 | 实体关系图 | 用户旅程图 | 甘特图 | 指令图 | 饼图

语法：

<div class="mermaid"> graph LR A[Hard edge] -->|Link text| B(Round edge) B --> C{Decision} C -->|One| D[Result one] C -->|Two| E[Result two] </div>

如果习惯使用 代码块 也完全支持。

字数/阅读时长统计

依赖 hexo-wordcount：

npm 用户：

cnpm install hexo-wordcount --save

yarn 用户：

yarn add hexo-wordcount

之后修改 Hexo 目录 下的 _config.arknights.yml 文件：

post: count: true # 是否显示字数统计 time: true # 是否显示阅读时长统计 文档加密

注意： 前端加密并不可靠！

注意！ 此加密插件会加密摘要内容，所以使用此插件时不能在正文中隐藏摘要。在 _config.arknights.yaml 文件中：

post: excerpt: true # 是否在文章中显示摘要内容（<!-- more--> 以上的内容）

可尝试使用 hexo-blog-encrypt 插件进行文档加密。

详细参考 hexo-blog-encrypt/ReadMe.zh.md

cnpm install hexo-blog-encrypt --save

在 Hexo/_config.yml 文件中添加以下内容：

# Security encrypt: # hexo-blog-encrypt abstract: 与 Rhodes Island™ 取得弱神经连接时需要口令 message: 请输入与 Rhodes Island™ 取得弱神经连接时的口令： tags: - {name: tagName, password: 密码A} - {name: tagName, password: 密码B} template: <div id="hexo-blog-encrypt" data-wpm="{{hbeWrongPassMessage}}" data-whm="{{hbeWrongHashMessage}}"><div class="hbe-input-container"><input type="password" id="hbePass" placeholder="{{hbeMessage}}" /><label>{{hbeMessage}}</label><div class="bottom-line"></div></div><script id="hbeData" type="hbeData" data-hmacdigest="{{hbeHmacDigest}}">{{hbeEncryptedData}}</script></div> wrong_pass_message: 与 Rhodes Island™ 效验口令失败，请重试。 wrong_hash_message: 与 Rhodes Island™ 效验口令失败，当前使用临时权限查看。

或 在文章的 Front-matter 区内设置：

--- title: Hello World tags: - 作为日记加密 date: 2016-03-30 21:12:21 password: mikemessi abstract: 与 Rhodes Island™ 取得弱神经连接时需要口令 message: 请输入与 Rhodes Island™ 取得弱神经连接时的口令： wrong_pass_message: 与 Rhodes Island™ 效验口令失败，请重试。 wrong_hash_message: 与 Rhodes Island™ 效验口令失败，当前使用临时权限查看。 --- 搜索

默认开启，若要关闭，在 Hexo/_config.arknights.yml 文件中：

search: enable: false Front-matter

除了 Hexo 支持的 Front-matter 还支持：

# 文章页右上角发布/更新日期 post-info: true/false # 侧边栏的目录 post-index: true/false # 打赏框 reward: true/false 引入自定义 CSS/JS 文件

可以在 Hexo/source/css/ 目录下放入自己的 CSS 文件； 在 Hexo/source/js/ 目录下放入自己的 JavaScript 脚本文件；

然后修改 Hexo/_config.arknights.yml 文件：

# 在 `<head>` 标签内引入 CSS 样式表 stylesheets: +- /css/custom.css # 在 `<body>` 尾部引入 JavaScript 脚本 scripts: +- /js/custom.js

资源文件夹是存放用户资源的地方。 除 _posts 文件夹之外，开头命名为 _ (下划线)的文件 / 文件夹和隐藏的文件将会被忽略。 Markdown 和 HTML 文件会被解析并放到 public 文件夹，而其他文件会被拷贝过去。

——来自 Hexo 官方文档

贡献

欢迎提交 Issues 与 PR。

分支说明

分支	说明
main	相对稳定的版本
dev	开发中的版本
gh-pages	gh-page 托管
hexo	Hexo 目录，这里有可以用于测试主题的 .md 文件

开发中可能遇见的问题及解决方法 修改 TS 文件不生效

TypeScript 需要手动编译，请全局安装 typescript 后在 arknights\source\js\_src 目录下执行 tsc 以编译。

运行 hexo serve --debug 时，长文章渲染不全

这是由热重载插件 hexo-browsersync 导致的，不会影响发布。

解决方法：禁用该插件。（反正不影响发布，不管也行）

参与开发可能需要的文档

Hexo 官方文档

Stylus 中文网

Pug 模板引擎中文文档

另外引用几个大佬的blog

Easy Hexo 让 Hexo 搭建的博客支持 LaTeX Hexo主题开发 - ﹏猴子请来的救兵 - 博客园 Hexo主题开发经验杂谈 | MARKSZのBlog Hexo 主题开发指南 | Peak Xin's Blog

贡献者 Yue_plus Laurenfrost ToUNVRSe 飞龙project DarkLingYun RyoJerryYu TTsdzb 支援主题开发

喜欢这个主题的话可以：

给颗小星星吧 (/▽＼)

√ ヾ(✿ﾟ▽ﾟ)ノ 100star 做个新主题哦~ 新主题开发中 Yue-plus/vuepress-theme-rhinelab

开发者的B服ID：24444750 加入 QQ 群：618221514

群内开发为主，吹水晒卡，分享线索7也都欢迎哦~ d=====(￣▽￣*)b

打赏、赞助: