OceanPress

这是一款从 思源笔记本 生成一个静态站点的工具

这个网站的文章内容就是基于 OceanPress 构建的

点击这里查看纯粹由 OceanPress 构建的「思源帮助笔记」的效果

特性

  1. 1.

    兼容思源绝大部分效果 🎉

  2. 2.

    生成彻底的静态站点,可以直接将文件拖拽到浏览器打开不需要启动 http 服务(非常适合用来分发软件的使用说明文档之类的)

    1. 1.

      目前完全离线会有显示上的一些问题,主要是 vditor 依赖的一些 cdn 资源还没有配置成本地资源,之后会实现完全离线

  3. 3.

    支持底部反链列表显示

  4. 4.

    支持生成 rss.xml 查看效果 - 崮生_最近更新.rss

  5. 5.

    可以配合 hexo 等系统一起使用 效果预览

  6. 6.

    良好的 SEO 支持 ,可以放心大胆的随意重构所有文档结构 不用担心用户无法通过原来的链接访问到重构后的文档。

  7. 7.

    周边/工具

    1. 1.

      website-check ( 尚未施工完毕 ) , 检查静态站点中的全部同站链接是否存在死链 (支持 a、iframe、video、audio、img 标签)

快速开始

请参见此 repo 文档 siyuan-note/oceanpress

待办

  1. 不断更新中...

  2. 自定义 emoji表情支持

  3. 路径重合的文档的处理方案

  4. 支持 hexo post 模式

  5. 重构嵌入块的样式,保持和思源一致

  6. 这里的两个链接 编译后变成了 iframe ,不应该这样

  7. 增量编译,不用每次全部编译一遍

  8. 对于底部反链中的块引用解析发出的警告 添加对应的描述

  9. 重构资源 copy 逻辑

版本迭代记录

最新代码

  1. 挂件块路径兼容

  2. tag 采用 v0.5.3_tested_on_siyuan_v1.3.3_Kernel_v1.3.3 这样的格式,前面的 v0.5.3 代表 OceanPress 自身的版本号,后面的 siyuan_v1.3.3_Kernel_v1.3.3 表示该版本在思源对应版本所生成的数据下进行测试和开发的

v0.5

  1. 兼容思源 v1.2.5 版本的文件目录改为 id 的行为,现在支持两种模式 id, title

  2. OceanPress 挂件块支持

  3. 支持思源文档图标功能,点击查看效果

  4. 优化 SEO,实现重定向功能 :「对于被移动到其他地方的文章(被移动到文档内则生成带id hash 的链接)生成一个包含 meta 标签的 html 页面,此功能基于之前编译所生成的数据并非所有浏览器都支持使用此元标记 ,还需要添加一段 js 代码来兼容」

    • 之前编译所生成的数据目前会存储在 设定的输出目录/assets/historical_data/redirect.json

  5. 使用请求缓存来持久化数据 git repo

    1. 创建一个基于 https://runkit.com/ 的 挂件块项目 2234839/run-code (github.com),使用上面所描述的包来实现思源与非思源的使用,这个项目可以作为一个示例

  6. 对于打开失败的文件进行跳过,不直接报错退出(不然每次我使用都要关掉思源)

  7. assets 文件访问逻辑修改

v0.4

  1. hexo 支持 (来源) 不需要添加功能

  2. 文档标题 ✨ feat(NodeDocument): 在顶部新增一个 h1 来显示文档标题

  3. 命名别名备注的效果实现 (命名,别名,备注 测试✨ feat(front-end-lib): 修正命名错误,添加命名别名等功能

  4. 头图显示功能6月文档设置了头图 )

  5. 在火狐上,任务列表前方的图标没有显示,引导线也未正常显示,优化列表样式兼容

  6. 🐞 fix(图片块): 居中效果

  7. 🦄 refactor(程序参数): 去除 AssetsDir 参数

v0.3

  1. ✨ feat(rss): rss 生成功能:在文档名为 [/s/S]*.rss.xml 这种格式的时候(例如:最近更新.rss.xml 最近新增.rss.xml
    会根据该文档内引用的其他文档另外生成一份 xml 格式的文件。

  2. 点击 cargo install itm 无法定位到该元素

  3. cargo install itm 此处下方渲染多了一行列表(应该算思源的bug,该列表内容为空但思源没有显示)

  4. 图片的居中效果没有生效,下方的描述文字也是这样

  5. 🐞 fix(代码块): 添加 id 等属性 之前没有 id 导致对代码块的引用无法跳转对应位置

  6. ✨ feat(块引用): 对于命名块的引用应该显示其命名,示例 rust Result

  7. 🐞 fix(块引用): 对于代码块的块引用没有渲染文本

  8. 当一个文档被同一个块内部引用了两次的时候底部反链也会渲染两次,应该改成只渲染一次 🎈 perf(底部反链): 相同的块只渲染一次 🎈 perf(render): 优化渲染速度;底部反链不再渲染当前文档内的引用

  9. 添加运行计时,优化编译速度

v0.2.9 以及之前的提交

  1. 块引用渲染产生了多余的空格

  2. 超级块排版渲染有比较严重的问题 🐞 fix(超级块): 修复顺序错乱

    1. 春秋义战 这里标题部分甚至渲染了两遍信息块

  3. 软换行没有渲染出效果 ✨ feat(软换行): 完成软换行适配

一开始想实现后来放弃了的特性(没有足够的收益)

  1. 利用 go:embed 将静态资源嵌入到二进制文件

开发记录

其他相关信息

OceanPress 开发规范

  • 发版

    • 使用 github 的 actions 功能在添加特定 tag 时自动发版

    • tag 采用 v0.5.3_tested_on_siyuan_v1.3.3_Kernel_v1.3.3 这样的格式,前面的 v0.5.3 代表 OceanPress 自身的版本号,后面的 siyuan_v1.3.3_Kernel_v1.3.3 表示该版本在思源对应版本所生成的数据下进行测试和开发的

思源 生成静态站点 issues 开发记录

md2website github 地址 移动到 siyuan-note 组织了 oceanpress github 地址( 相关 issues ) , 并且改名 OceanPress

OceanPress 挂件块支持

起始-qq群讨论

88250 2021-05-25 22:05:31 @2234839 思源挂件块 Widget Block

2234839 2021-05-25 22:08:27 @88250 看上去如果没有运行时的api调用的话 oceanPress 可以兼容 /疑问

88250 2021-05-25 22:09:08 iframe 得有伺服环境

2234839 2021-05-25 22:16:28 直接兼容好像不可能,不过挂件块如果提供一个hook函数在这个函数内做完从用户输入以及思源api调用返回他需要的数据,oceanpress 将这个数据持久化到页面然后再通过iframe喂给挂件块。还是有一定的机会

88250 2021-05-25 22:18:14 了解,这部分下个月我们讨论一下

2234839 2021-05-25 22:18:23 @88250 OK

可行性

  • golang 的 ECMAScript/js 引擎 : https://github.com/dop251/goja

    • 对 es6 的支持还不太行(也许可以通过运行 babel.js 来解决这个问题)

我目前的大致思路就是利用 goja 来 执行 hook 函数并持久化数据

使用请求缓存来持久化数据 git repo

提供一个npm包,用来支持 思源笔记的api请求和数据持久化,方便用于 oceanpress 这样的离线场景

原理:在处于思源笔记内运行时,对于查询类的 api 对请求结果进行缓存(存到自定义属性)
处于非思源笔记场景时对于查询请求就不会发送xhr了而是使用之前缓存的结果

其它特性

- 利用 .d.ts 提供思源接口的类型
- 提供环境判断的函数使挂件可以知道当前处于什么模式,便于其停止写操作以及相关 ui 的展现

架构设计

  • 角色

    • 挂件块使用者

    • 挂件块开发者

  • 场景

    • 思源笔记

    • 非思源笔记

  • 功能

    • 思源 api 调用

    • 判断所处环境

by 崮生 from 崮生 • 一些随笔 🎨,欢迎 赞助本文
本文欢迎分享与聚合,全文转载未经授权( 联系我)不许可。