外置文件

2020年04月12日 11:02

对于图片和小文件,我打算修改一下官方用于引用本地文件的external-attachments插件,设置 import hook,在导入文件后让 tiddler 直接引用复制到了本地 wiki 文件夹里的文件。

然后写一个模板,在打包 HTML 文件时把 _canonical_uri 替换为 Github 上的文件的 URI。

我最终将其包装成了 $:/plugins/linonetwo/github-external-image 插件。


我在修改 ./Meme-of-LinOnetwo/tiddlywiki.info 配置插件时发现,这个文件里还定义了打包 HTML 文件时的步骤,我经过几次尝试和修改,最终改成了这样:

{
	"build": {
		"index": [
			"--rendertiddler",
			"$:/plugins/tiddlywiki/tiddlyweb/save/offline",
			"index.html",
			"text/plain"
		],
		"externalimages": [
			"--setfield",
			"[is[binary]] [type[application/msword]]",
			"_canonical_uri",
			"$:/core/templates/canonical-uri-external-image",
			"text/plain",
			"--setfield",
			"[is[binary]] [type[application/msword]]",
			"text",
			"",
			"text/plain",
			"--rendertiddler",
			"$:/core/save/all",
			"index.html",
			"text/plain"
		]
	}
}

我只要修改这里面的 externalimages 涉及到的模板就可以达成我的需求了。

第一部分的作用是找到所有是图片([is[image]])的 tiddler,用 $:/core/templates/canonical-uri-external-image 这个模板来设置它们的 _canonical_uri 字段:

	"--savetiddlers",
	"[is[image]]",
	"images",
	"--setfield",
	"[is[image]]",
	"_canonical_uri",
	"$:/core/templates/canonical-uri-external-image",

因为我只在云端编译打包 HTML 文件,打包时静态资源肯定都已经上传到 Github 了,所以在 $:/core/templates/canonical-uri-external-image 里我就直接把 URI 设置为以 https://raw.githubusercontent.com/linonetwo/wiki/master/Meme-of-LinOnetwo/tiddlers/ 为前缀的 Github 静态资源地址了。

用同样的原理,设置 canonical-uri-external-raw.tidcanonical-uri-external-text.tid 也可以外置大的二进制文件和文本文件。不过还得改一下 filter,只外置大于一定大小的文件。

最后一部分原来是生成 HTML 和 JS:

	"--rendertiddler",
	"$:/core/save/all-external-js",
	"index.html",
	"text/plain",
	"--rendertiddler",
	"$:/core/templates/tiddlywiki5.js",
	"tiddlywiki5.js",
	"application/javascript"

我使用了 $:/core/save/all-external-js 这个生成不含核心 JS 的 HTML 的模板,以及 $:/core/templates/tiddlywiki5.js 这个只含核心 JS 的模板,从而分离 HTML 和 JS,不过这在 5.1.22 上不好用。

不过这个 $:/core/templates/tiddlywiki5.js 是服务端使用的 JS,会自动保存还有请求 Tiddlers 列表,所以我在 public 文件夹里预备好了这些请求的回复


即便如此, HTML 还是有 4 M 大,可能可以通过 lazy load tiddler 来优化,但是那也是个生成 HTML 的模板,可能和 $:/core/save/all-external-js 会冲突,以后如果 tiddlers 真的很多了,导致 HTML 过大了,再折腾这个。

减小 HTML 还可以通过 minify 来达成,所以我搞了一些简单的 minifier 来做这事。

以后再考虑上传大于一定大小的大文件后,就上传到七牛云去,把文件桶类型设置为「大文件分发」。它和又拍云一样,想绑定自己的域名都需要备案,但是七牛云会给一个它的域名用。