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

大家的板块 allor的无聊
1

玩游戏玩累了，发个笔记刷刷存在感 :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 个赞
2

谢谢大佬！

4

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

5

如果运行服务器时，有如下提示：

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"
],

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

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

6

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

7

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

8

研究到现在还有一种方式，不需要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 文件夹的路径也带上

9

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

10

可以
看正文末尾

11

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

12

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

13

谢谢，我再学习一下。

14

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

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

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

相关链接：

15

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

内部的 JavaScript 错误

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

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

16

手机端怎么使用呢

17

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

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

18

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

19

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

  • 使用别的软件运行 Tiddlywiki

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

  • 使用最新发布版本

20

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

1 个赞
21

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