我开发了一款属于自己的Typora主题!
关于 typora-theme-Fugu
接触markdown好像有一年多了,我的所有的笔记和包括论文的草稿都是先使用markdown书写,只需要简单的符号就可以获得非常有条理的目录,列表以及好看的代码高亮,我已经完全离不开他。
而typora这一款好看的编辑器也是凭颜值拿下了我,它的所见即所得相比于实时预览体验更好。我也是当时就付费了正版。
使用了不少主题,他们各有特色,风格迥异,可以根据自己书写的内容选择合适的主题,而对我而言使用频率最高的还是学习笔记,会大量的使用代码块。
Lapis、Next、Zj、Vue等,都是我非常喜欢的主题,但是有一些个人不太喜欢的点,毕竟每个人的审美都不一样,最终,我基于Lapis,根据自己的喜好,diy 了这款属于自己的主题。
更多介绍和最新版本下载,请到Github 地址,[Gitee 地址](typora-theme-Fugu: 一款基于 Lapis 的 Typora 主题 (gitee.com))。
开发环境搭建
开发过程也有一点值得记录的事情,官方给出的开发者文档中提到,由于typora本身版本更新可能更改元素名,所以其开发工具typora/typora-theme-toolkit已经停止维护了,建议开发者使用typora内部的调试工具,获取最新的元素结构。这样就导致,无法使用live-server
的html
实时开发插件。即便更改了主题文件夹内的文件内容,typora只有重启才会加载效果,这样非常不便。
不知道是不是我没有找对方法,我已经开启了调试模式。
最终我找到了办法,首先,基于Markdown-it 演示 — markdown-it demo的内容,我得到了一个覆盖所有语法元素的markdown文档,然后将他复制进typora,导出为html
格式,得到的文件使用vscode-live-server
插件就可以愉快的开发了。
对于喜欢的主题想要学习每个样式的写法,则可以直接在typora的调试工具,看到元素的属性,配合主题文件夹下的源码,效果更佳。