安利一下markdown预览插件maple-preview

Emacs-general
1

原本是我根据markdown-preview-mode修改了一部分，自己简单用着的，后面有时间把它整个重写了,现在支持 markdown, org-mode(转换成markdown), html预览(html滚动有些问题)

maple-preview没有其它外部工具的依赖，也不会生成任何文件, 唯一需要做的，就是M-x package-install websocket simple-httpd, 然后M-x load-file maple-preview.el, 也可以

(use-package maple-preview
  :load-path "site-lisp/maple-preview"
  :commands (maple-preview-mode))

相关变量

maple-preview:port 8080
;; Preview http port.

maple-preview:websocket-port 8081
;; Preview websocket port.

maple-preview:browser-open t
;; Auto open browser.

maple-preview:css-file
;; custom css default: '("/static/css/markdown.css")
maple-preview:js-file 
;; custom js, 如果需要支持MathJax, 应该只需要在这设置一个js文件, 不过我也没试过

地址: maple-preview

4 个赞
2

会上 melpa 吗？

3

这周末我试一下能否上传到melpa.

4

这个看起来跟flymd，livemarkdown很类似啊，有什么优缺点呢？

5

flymd 并非 server-client 模式，它是通过浏览器频繁刷新实现实时预览：

    Emacs                                Browser
+------------+                        +------------+
|   foo.md   | ------- launch ------> | flymd.html |
+------------+                        +------------+
      |                                      |
      |                                      |
   typing                               xhr request ∞
      |                                      |
      |            +------------+            |
      +----------> |  flymd.md  | <----------+
                   +------------+
                   Working Buffer
1 个赞
6

flymd是生成一个文件然后定时刷新，livemarkdown我暂时没找到.

写这个的初衷是因为我不想生成任何文件和依赖外部工具就可以实时预览，当初找到了 markdown-preview-mode, 但是使用后发现不符合我的习惯，所以重新修改了一下

maple-preview是采用websocket通信方式, 当插入字符(post-self-insert-hook)或者是保存文件(after-save-hook), 都会触发websocket server发送文件内容到浏览器端

7

我新建了一个仓库 https://github.com/honmaple/emacs-maple-preview, 有需要试用的可以不用clone整个dotfiles了

8

希望能把错误显示在 emacs 里，而不是页面里，方便debug

9

CSS 效果似乎有问题啊，我今天试用的结果是这样。字很小，图片很大~~~

image
image2030×1792 418 KB

10

你说的是html文件里的console.log(event)吧，一般出现错误都是连接问题，所以打印到浏览器端，如果有其他错误, emacs会自己打印的

11

确实是css文件有问题，我刚更新了一下css文件，现在应该没有图片宽度100%的问题了,或者你也可以自定义css

12

这种图你是怎么画的，纯手撸吗

1 个赞
13

emacs有一个artist-mode。。。纯文本

14

mermaid PR 能支持一下mermaid吗？稍微改了一下，只要一编辑 mermaid api生成的图就消失了。

15

@xiyang windows 上使用 maple-preview-mode 出现

error in process filter: ws-error: Writing to process: Software caused connection abort, ws-server <127.0.0.1:61088>
error in process filter: Writing to process: Software caused connection abort, ws-server <127.0.0.1:61088>
error in process filter: ws-send-500: Writing to process: Software caused connection abort, ws-server <127.0.0.1:61089>
error in process filter: Writing to process: Software caused connection abort, ws-server <127.0.0.1:61089>

过程描述： 使用 maple-preview-mode 后打开 browser 后闪现一下预览后就自动关闭了 browser 的标签页，之后就报上面的东西 是出自什么问题吗

16

是的，最新的有问题，用之前simple-httpd的版本没问题，新版本换成web-server了。

17

@lynnux 麻烦用的哪个 commit 的 simple-httpd

18

我很久没用windows了 :joy:，刚才我试了一下，windows上可能是换行符的编码问题，快速修复可以使用

(defun custom-websocket-text (text)
  (if (eq system-type 'windows-nt)
      (replace-regexp-in-string "\n" "^M" text)
  text))

(advice-add 'maple-preview:websocket-text :filter-return #'custom-websocket-text)

其中 ^M 使用 C-q C-m 插入，具体还得再测试一下

19

主要是simple-httpd无法浏览当前目录下的图片，而且端口进程都是全局变量，如果有其它服务在使用simple-httpd就会有冲突，web-server 的好处是不仅可以浏览当前目录下的图片，还可以合并http端口和websocket端口

但是 web-server 的 websocket 不支持 utf-8，所以只能利用现有的websocket库来转换发送的字符串，目前看这个转换在windows下还有些问题，具体我再研究一下

20

还是失效 :joy: