[笔记]TiddlyWiki+Node.js 打造本地便携wiki

玩游戏玩累了,发个笔记刷刷存在感 :joy:

目录:

  • 简介
  • 搭建
  • 使用
  • 自定义
  • 其他

简介:

TiddlyWiki 是一款挺容易上手的开源 wiki,最简单的版本就一个 html 文件,只要你会上网会双击,那么你就跨过使用 wiki 的第一道门槛——安装。
但上手之后 html 版就不大够用了,不能自动保存(需要装浏览器插件)、不能在外部编辑内部内容、体积越大越慢等等。好在这些问题只是在 html 版才有,新手的话推荐一开始就用官方的 TiddlyDesktop (基于nw.js),有折腾的爱好的可以按下面的简单教程用 Node.js 搭建本地服务器版。

该Node.js版的优点:

  1. 和 Html 版一样绿色便携免安装,只是从一个文件变成一个文件夹
  2. 没有 Html 版的痛点,自动保存、本地独立文件、按需加载……
  3. 支持多开
  4. 因为是本地独立文件,允许外部编辑,所以能用脚本撸黑科技

注:此为 Windows 平台的教程,TiddlyWiki 的 官网 Github 上有其他平台的详尽教程,看不了英语的可以看爱好者搞的中文网站 繁中

搭建

  1. nodejs.org 下载 node.js for Windows(zip版,我们只需用到里面的 node.exe
  2. 到 TiddlyWiki 的 Github 下载最新版本或者自己打包github内容
  3. 解压 TiddlyWiki ,把node.exe放进去(和tiddlywiki.js在一起)
  4. 在当前目录进入命令行(资源管理器地址栏敲 cmd),下面所有命令都是在这命令行窗口进行:
  5. node tiddlywiki //测试运行&查看tiddlywiki相关命令
  6. node tiddlywiki mywiki --init server //新建一个名为 mywiki 的 wiki (文件夹)

一个支持自动保存和文件独立存储的 TiddlyWiki 就这么搭起来了。

使用

  1. node tiddlywiki mywiki --server //启动 mywiki 服务器
  2. 浏览器访问 http://127.0.0.1:8080
  3. 命令行窗口ctrl+c退出并关闭服务(直接关node.exe 的窗口也行)

如果你有多个 wiki,可以参照官方文档修改一下启动参数里的端口号来多开。
如果喜欢双击运行,可以用我这个半成品 AHK 脚本(放到根目录):

;启动并获取pid
Run, node.exe tiddlywiki mywiki --server,,,PID
;命令行判断服务器是否已启动,已启动则下一步,否则测够10秒再下一步
cmd = "@for /l `%i in (1,1,10) do timeout /t 1 /nobreak & netstat -ano|findstr "127.0.0.1:8080.*%PID%\>" && exit"
runwait %comspec% /c %cmd%
;打开网页
Run, http://127.0.0.1:8080

自定义

一. 中文服务器版

下载回来的 TiddlyWiki 自带很多版本(详见 editions 文件夹),服务器版自带自动保存插件,中文版得后期自己装。
搭建时 --init server 里的 server 就是版本名,所以搭建中文版就应该用 --init zh-Hans
如果有经常搭建的需要,可以自定义一个中文服务器版

  1. editions 文件夹内,找到并复制 zh-Hans 文件夹为 zh--server
  2. 复制 server 文件夹的 tiddlywiki.info 覆盖 zh-server 里的同名文件
  3. 用记事本打开复制过来的 tiddlywiki.info
  4. 参照原文格式,在 "build": { 上面插入以下三行内容
	"languages": [
		"zh-Hans"
	],
  1. 以后搭建时用 --init zh-server 即可

二. 文件归类

server 版 TiddlyWiki 的内容是以一个个独立文件来储存的,其内容在 TiddlyWiki 里可以通过 tag 来分类索引,其文件本体也可以通过创建相应的规则让其自动归类到相应文件夹。(英版原文

  1. 打开 TiddlyWiki,新建条目,标题为 $:/config/FileSystemPaths
  2. 内容为
[is[system]removeprefix[$:/]addprefix[mysystem/]]
[is[image]addprefix[myimages/]]
[tag[task]addprefix[mytasks/]]
[has[draft.of]addprefix[mydrafts/]]
[!has[draft.of]]

3.保存即可

上面的设置就是把标题当作文件路径,根据 tiddly 的类型、标签、属性来为其标题增删前缀,让标题变成一个路径,使 tiddly 按路径储存。
上面那堆 myxxxx 就是自定义的储存路径。在设置好之后也可以通过使用 aaa\bbb\ccc 这样的标题把 ccc.tid 保存到 .\aaa\bbb 文件夹。

这个设置也可以整合到自定义的 zh-server 里,免得每次搭建都要重设。只需在硬盘上找到你刚创建的FileSystemPaths.tid,把它复制到 zh-server 里同样路径下就行。其他设置同理。

其他

  1. 可以用 node tiddlywiki mywiki --build index 命令将 mywiki 打包为单一 html 文件,输出到output文件夹。
  2. 为什么那个 AHK 脚本是个半成品,因为我懒……
  3. 本文基于以前的笔记稍微增删搞出来的,可能有过时的内容,一切以官网为准。
6 个赞

谢谢大佬!

我个前端,好像有 Node.js 环境……居然懒惰的忽略了这个方案。试试去!

如果运行服务器时,有如下提示:

Warning: Plugins required for client-server operation (“tiddlywiki/filesystem” and “tiddlywiki/tiddlyweb”) are missing from tiddlywiki.info file

则无法使用自动保存,修正的方法也很简单,直接编辑对应文件夹下的 tiddlywiki.info 文件,按如下格式添加上对应的插件即可。

"plugins": [
  "tiddlywiki/filesystem",
  "tiddlywiki/tiddlyweb"
],

如果打开的页面只有基本内容没有样式,可能是在启动命令中将文件夹名写错了。

如上是我遇到的一点小问题,记录下来以供参考。

关于那个ahk脚本,–server参数官方不推荐再用而是改为–listen,然后后面可以加上host和port参数这样可以用局域网其他设备访问(第一次用node半天没成功发现8080端口被NI的某个服务占了 :joy:

我直接按官方的 readme 搞了一个 nodejs 版,安装完后不知道装到哪里去了,然后运行后点安装插件也不显示,改中文也无法改,目前正换到 tiddlydesktop 版本

研究到现在还有一种方式,不需要ahk脚本,bat脚本就行。

  1. 新建文本文档

  2. 加入示例代码,如:

@echo off  
start D:\nodejs\node.exe tiddlywiki mywiki --listen
start C:\Users\Administrator\AppData\Local\Google\Chrome\Application\chrome.exe http://127.0.0.1:8080
  1. 把后缀改为 .bat,点击运行

ps:这是这几天天天在文件夹中打开 powershell 敲字母敲烦了(个人需求不用ahk)最后东平西凑出来的(完全不了解batch)…… 唯一问题是必须放在和 node.exe 同一个文件夹,我的解决办法是快捷方式放到桌面,当然不嫌麻烦的话。可以这样:

@echo off  
start D:\nodejs\node.exe D:\nodejs\tiddlywiki D:\nodejs\mywiki --listen
start C:\Users\Administrator\AppData\Local\Google\Chrome\Application\chrome.exe http://127.0.0.1:8080

就是把 tiddlywiki 和 mywiki 文件夹的路径也带上

nodejs版本能导出html版本给别人看吗,别人看要装服务器就麻烦了。

可以
看正文末尾

所以为什么不试试 docsify ,,,
水水的书签收藏:https://wdssmq.github.io/bookmarks/#/

这就麻烦了,而且docsify估计不如同类的 Jekyll、hexo 和 hugo 好用

谢谢,我再学习一下。

老实说,没必要,毕竟TiddlyWiki一个单文件走天下,可扩展性极强,小白也能操作。而且 docsify 给人一种……范围很窄的感觉,比如写产品文档,而且扩展性更不用说了。这里的扩展性可能有人说了,docsify 也能扩展啊,但是我说的是一个生态问题,不光是生态,更是他的便于操作,可视化等等。

ps:看到这里可能觉得我会来个“但是”保护自己不被骂,但是我不会,因为我觉得在这件事上,扯到 docsify 完全没必要,看看 docsify 官网“一个神奇的文档网站生成器”,就可以知道定位完全不同了,标题中的维基和文档还是有区别的(即使生活中会并列叫它“维基文档”,但基本上,文档像是维基的子集,有时又是分开提的,国外也是如此),这个不用详谈。

不过嘛,我也不是为了争赢啥,只是想说 docsify 在这个贴子下作为推荐是不适合的选择。

相关链接:

我遇到了一个问题,那就是偶尔弹出一个红色的窗,有时候甚至不能关闭这个窗。上面写着:

内部的 JavaScript 错误

喔,真是令人尴尬。建议刷新您的浏览器,重新启动 TiddlyWiki

Uncaught TypeError: Failed to execute ‘getComputedStyle’ on ‘Window’: parameter 1 is not of type ‘Element’.

手机端怎么使用呢

是否是使用了版本较旧的浏览器?

手机端不建议使用(不好操作),不过坚持要用的话,这里有一个安卓客户端,综合考虑这是最适合入门的手机端使用 Tiddlywiki 方式了。
酷安市场下载地址|GIthub 发布页|镜像下载地址

我用的是Mircosoft Edge. 没别的浏览器了

我能想到的是使用的手机浏览器,Tiddlywiki 版本较旧或过于新(非发布版本),Tiddlywiki 插件冲突,浏览器插件与 Tiddlywiki 冲突。
可以试试这些方法看会不会出现问题:

  • 使用别的软件运行 Tiddlywiki

  • 禁用 Tiddlywiki 插件或禁用浏览器插件再运行 Tiddlywiki

  • 使用最新发布版本

我是用 twexe(Single File TiddlyWiki executable),它可以将 html 文件与一个 exe 文件打包在一起,然后自动完成部署,自动保存时会生成新的 exe 文件并在原位置进行替换,同时导出 html 文件备份。

1 个赞

本人感覺opera手機瀏覽器能直接打開本地html,是最適合入門的了,因為我也是剛剛入門。