前言※
前段时间，Github 有个大佬在 Trilium 提交了一个 pr，最为关键的新增功能是为 Trilium 增加了 ~shareTemplate 属性，起初我对这个功能并没有多少注意，但是最近研究了下简直像是挖到了宝藏一样兴奋！
简单来说，这个功能是对 Trilium 笔记分享功能的一个巨大提升，原本的分享功能实在过于简陋，但是现在可以使用 ~shareTemplate 使用自定义的分享模板（EJS）。也就意味着现在 Trilium 不仅仅是后端服务器，甚至可以写一个前端模板，使 Trilium 成为一个完整的博客系统！
本站就是以 Trilium 分享功能为基础搭建的博客，欢迎参观。
计划实现的功能※
实现原理※
搭建一个博客，无非就是三大件：HTML、CSS 和 JS。在 trilium 中可以在分享根节点上赋予 ~shareTemplate 、 ~shareJs 、shareCss 属性分别实现，注意这几个属性一定要设置为 inheritable 。
~shareTemplate※
该属性用于创建 html 模板，具体的代码细节就不说了，大概就是分享的根笔记中添加 ~shareTemplate(inheritable)=<xxx> 关系，其中<xxx>是一个 Embedded JavaScript(EJS) 笔记，EJS 是一种模板语言，支持将 JavaScript 动态渲染到网页上。如果具有子模块，也会通过 include 方法自动附加。
一个模板结构有可能像是这样：
- myPage.ejs
- toc.ejs
- menu.ejs一个标准的模板文件(.ejs)可以参考下官方仓库的这个文件：page.ejs ，这是官方分享功能的模板页面，功能比较基础。在模板被渲染时，模板中会传入笔记参数，有几个比较关键的变量如下：
- note - 当前渲染的笔记
- subnote - 分享的根笔记
- content - 笔记内容
- isEmpty - 笔记是否为空
其中 note 和 subnote 拥有一些属性和方法，详细属性或方法可阅读源码，或 TriliumApi - Fnote 。
~shareJs※
该属性用于创建分享界面所需要的 js 脚本，比如一些按钮事件、点击事件、初始化等，使用方法同样是通过 ~shareJs(inheritable)=<xxx> 引用一个 js 前端脚本。
~shareCss※
该属性用于创建分享界面所需要的 CSS 样式 ，通过 ~shareCss(inheritable)=<xxx> 引用一个 CSS 样式文件。
搭建评论系统※
之前使用的是 Twikoo 评论系统，已经在 MongoDB 云数据库和 Vercel 部署好了，所以可以直接拿来用。Twikoo 支持使用 CDN 方式引入，那么我们直接在模板中引入即可。
<div id="tcomment"></div>
<script src="https://cdn.staticfile.org/twikoo/1.6.26/twikoo.all.min.js"></script>
<script>
twikoo.init({
envId: '', // 腾讯云环境填 envId；Vercel 环境填地址（https://xxx.vercel.app）
el: '#tcomment', // 容器元素
// region: 'ap-guangzhou', // 环境地域，默认为 ap-shanghai，腾讯云环境填 ap-shanghai 或 ap-guangzhou；Vercel 环境不填
// path: location.pathname, // 用于区分不同文章的自定义 js 路径，如果您的文章路径不是 location.pathname，需传此参数
// lang: 'zh-CN', // 用于手动设定评论区语言，支持的语言列表 https://github.com/twikoojs/twikoo/blob/main/src/client/utils/i18n/index.js
})
</script>
发表&迁移博客※
之前部署的 Hexo + githubPage + Vercel 的静态博客，所有博客均在 trilium 中完成，所以在 trilium 中发表&迁移博客变的非常简单！
Hexo 支持一键推送到 github，但是博客与笔记之间总有一种割裂感：
- 要考虑图片的存储和备份
- 不方便随时修改
- 笔记 → 博客 需要处理格式
虽然写过一个脚本一键转换笔记格式：将trilium导出的文章转换为hexo博文 ，但实际体验下来还是略显繁琐。
但现在分享博客和写笔记之间完全是无缝的体验，下面是我当前的笔记(博客目录)结构：
每一级笔记代表一个目录（目前只支持一级目录），如果有需要发表的博客直接把笔记clone到对应的文件夹下面即可。
反向代理※
Trilium 共享出的地址比较长，类似这样：https://localhost:8080//share/AmTnScaLvxtE ，作为一个博客，这样的地址实在不太好看。所以需要做一些配置。
首先需要在分享的根目录中添加 #shareRoot 标签，这会让地址的可读性变强、并且使其成为网站的根节点。
随后使用Nginx或caddy进行反向代理，我使用的是caddy2，配置类似如下：
网址 {
@notShare {
not path /share*
}
rewrite @notShare /share{uri}
reverse_proxy localhost:8080
}
结语※
花了几天时间做的模板，当然很多地方还可以优化。
trilium 的这个新功能打通了我理想中的知识管理体系：收集 → 内化 → 分享。接下来可以安心写笔记分享博客折腾下一个玩具了。
