在 Mac / Chrome 中实时地预览 Markdown 导出的结果

xuchunyang · 2017 年8 月 22 日 06:30

刚刚发现了一个自动刷新 Chrome 当前 Tab 的 AppleScript 代码（Gist）：

tell application "Chrome" to tell the active tab of its first window to reload

利用它能“实时”地预览 Markdown 了，也就是在保存 Markdown 时，Chrome 自动刷新显示结果的页面：

M-x chunyang-markdown-preview-in-chrome 在 Chrome 预览，不同于自带的 M-x markdown-preview，它会重用当前的 Tab，不会一直创建新的 Tab
M-x chunyang-markdown-preview-in-chrome-mode 一个 Local Minor Mode，会在保存文件时，自动调用上面的命令

(defun chunyang-chrome-refresh ()
  "Refresh the current tab of Chrome."
  (do-applescript
   "tell application \"Chrome\" \
to tell the active tab of its first window to reload"))

(defun chunyang-chrome-url ()
  "Return the URL of the current tab of Chrome."
  (replace-regexp-in-string
   (rx (or (and string-start ?\")
           (and ?\" string-end)))
   ""
   (do-applescript
    "tell application \"Google Chrome\" to return URL of active tab of first window")))

(defun chunyang-markdown-preview-in-chrome ()
  "Export Markdown and preview the result in Chrome.
This function reuses the current tab of Chrome,
unlike `markdown-preview'."
  (interactive)
  (let ((output (markdown-export)))
    (if (string-match-p (regexp-quote output) (chunyang-chrome-url))
        (chunyang-chrome-refresh)
      (browse-url output))))

(define-minor-mode chunyang-markdown-preview-in-chrome-mode
  "Run `chunyang-markdown-preview-in-chrome' on save."
  :lighter " MD-Preview-in-Chrome"
  (unless (eq major-mode 'markdown-mode)
    (user-error "Error: %s is not Markdown Mode" major-mode))
  (if chunyang-markdown-preview-in-chrome-mode
      (add-hook 'after-save-hook #'chunyang-markdown-preview-in-chrome :append :local)
    (remove-hook 'after-save-hook #'chunyang-markdown-preview-in-chrome :local)))

同样的方法可以用在 Org mode 或者其它的格式，甚至导出的格式也不一定得是 HTML，因为 Chrome 也能支持图片、PDF 等。

xuchunyang · 2017 年8 月 22 日 06:50

贴两张使用场景图，在 Emacs 中编辑 Markdown，保存时 Chrome 自动刷新。中间不会有窗口焦点的变化，或者别的干扰。

图一、

图二、

et2010 · 2017 年8 月 22 日 07:00

赞，可惜没有 Mac

xuchunyang · 2017 年8 月 22 日 07:25

关于自动刷新浏览器的页面：

别的平台（其实 Mac 也行）可以用模拟键盘按键的方法，比如 Linux 下的 xdotool¹，但很可能需要切换窗口，这样就会有非常明显的视觉效果，非常讨厌。
http://entrproject.org/ 上提到 Midori 浏览器（支持 Linux 和 Windows）可以通过命令行参数来刷新页面。

除了这几种思路，肯定还有其它的、我没想到的办法。

¹ http://entrproject.org/ 上提到了一个 reload-browser 脚本就是利用它实现的。

ashfinal · 2017 年8 月 22 日 07:40

大部分浏览器刷新都是用的 live-reload 脚本，再配合编辑器只推送文本变动部分。就更“实时”了，变更一个字也给你推送过去，连文件保存都不需要。

ztlevi · 2017 年8 月 23 日 00:20

我的workflow就是用typora（其他markdown编辑器也可）打开emacs 编辑的markdown文件。绑定一个快捷键到用typora打开当前文件即可。

seagle0128 · 2017 年8 月 25 日 15:29

为什么不试试flymd？

ztlevi · 2017 年8 月 26 日 11:36

这样的好处是可以享受gui下的markdown 编辑器的各种便捷，比方说export，侧栏outline等等。flymd最大的问题是对chrome支持略蛋疼。。。悲剧

seagle0128 · 2017 年8 月 26 日 16:36

flymd有什么问题呢？

ztlevi · 2017 年8 月 26 日 16:57

官网上说，用chrome需要kill chrome的所有进程，然后才能用。。。这不是灰常蛋疼吗？

et2010 · 2017 年8 月 26 日 17:13

最让人感到好奇的是， flymd 的作者 mola-T 接连发布几个包（有些是挺牛逼的包）之后就沉寂了，完全从 github 隐退了。

nesteiner · 2020 年4 月 2 日 15:23

请问do-applescript这个函数在哪里安装？，我的系统Ubuntu

xuchunyang · 2020 年4 月 2 日 15:27

AppleScript 是 macOS 下才有，其它操作系统没有。

seagle0128 · 2020 年4 月 3 日 15:24

现在用这个吧

cireu · 2020 年4 月 3 日 15:26

写博客的时候，开着vuepress live development，npx vuepress dev docs.保存自动更新刷新浏览器

tianzhushan · 2022 年6 月 7 日 12:54

how？可否赐教？

ztlevi · 2022 年6 月 19 日 17:26

github.com

ztlevi/doom-config/blob/e3ea137ff6cc4753bb5e16488ba5f9ba5c317683/+os.el#L34


      
          (when IS-MAC
            (+macos--open-with reveal-in-finder nil default-directory)
            (+macos--open-with reveal-project-in-finder nil
                               (or (doom-project-root) default-directory))
          
          
  (+shell--open-with reveal-in-apps (+os/read-apps)
                               (string-join `("'" ,(get-filename-with-line-number) "'")))
            (+shell--open-with reveal-project-in-apps (+os/read-apps)
                               (or (doom-project-root) default-directory))
          
          
  (+macos--open-with reveal-in-typora "typora" buffer-file-name))
          
          

          
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
          ;; LINUX
          ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
          
          
(when IS-LINUX
            (defvar linux-terminal (cond ((executable-find "alacritty") "alacritty")
                                         ((executable-find "xst") "xst")
                                         ((executable-find "tilix") "tilix")

tianzhushan · 2022 年11 月 13 日 14:54

我用了call-process, 这样可以少生成一个buffer。

 (defun markdown-open-by-typora ()
	"Open file in Typora to preview the markdown file"
	(interactive)
;;	(my-sh-send-command (concat "/usr/bin/open -a Typora " buffer-file-name)))
	(let ((process-connection-type nil))
      (call-process "/usr/bin/open" nil nil nil "-a" "Typora" buffer-file-name)))