簡書的本地化 動機 文件目錄部署 插圖 文章發佈 預覽 待續

我在自己的計算機上創建一個叫作「簡書」的目錄,決定從這篇文章的下一段開始,用自己喜歡的文本編輯器 Emacs,在這個目錄內寫文章,寫好後再在簡書上發佈。這個行爲,我稱爲簡書的本地化。

動機

之所以將簡書本地化,是因爲:

  • 好像是在工作,而不是摸魚。即使還沒找到工作的人,會覺得自己居然是在工作。
  • 用 Emacs 寫文章,比簡書網站或 APP 提供的文章編輯功能更有效率。即使對 Emacs 不熟悉 [1],在長期用它寫文章的過程中也會慢慢熟悉。當然,前提是在簡書網站或 APP 的設置裏,將簡書編輯器設爲 Markdown [2] 模式。
  • 將來萬一不想用簡書了,本地所寫的文檔也很容易轉移到其他網站上,只要這些網站支持 Markdown。
  • 對於個人的全部文章,簡書提供的一鍵打包備份功能,僅能備份文字部分,不能備份文章裏的插圖。在本地寫文章,本身就是對文章進行備份,插圖可自行管理,文集可用子目錄代替。此外,可讓 git 當史官,記錄和管理所有文章的修改歷史。
  • 能迫使我時常能夠溫習 Linux 環境裏常用的文本處理工具,例如 bash、sed、awk、grep、m4、make……

文件目錄部署

在我創建的 簡書 目錄裏,每個子目錄都對應簡書上的一個文集,這些子目錄稱爲文集目錄。

每個文集目錄裏,存放 Markdown 文檔和插圖。Markdown 文檔名就是簡書上的文章標題。插圖皆放在文集目錄的子目錄 圖片 內。圖片 目錄內的每個子目錄是與文集目錄內的文檔同名,表示前者之內存放着後者所需的插圖。下面是我的一個文集目錄的示例:

簡書/我的迷惑行爲
├── 圖片
│   └── 簡書的本地化
└── 簡書的本地化.md

爲了避免動手在 圖片 目錄內再輸入一次文檔名,我寫了一個 bash 腳本 jianshu-new-post:

#!/bin/bash

touch ${1}.md
mkdir -p 圖片/$1

爲這個腳本增加可執行權限,

$ chmod +x jianshu-new-post

將其保存於 $HOME/scripts 目錄,然後在 $HOME/.bashrc 文件中將該目錄加入系統 PATH 變量裏 [3]

PATH=$HOME/scripts:$PATH

倘若是確定需要插圖的文章,就使用 jianshu-new-post 命令進行創建,例如:

$ jianshu-new-post 簡書的本地化

然後就有了上述所示的文檔及其插圖目錄。

倘若對 bash 腳本足夠熟悉,可以在 jianshu-new-post 腳本增加更多的功能。譬如,在創建文檔的時候,自動在文檔中增加時間戳、版權聲明等內容。

插圖

用上述的簡書本地化系統創建的文檔,若需要插圖,建議採用 Markdown 的引用式插圖語法。例如:

……

首先應該用鉛筆在紙上繪製草圖。不過,我沒找到鉛筆,好不容易找到了一支中性筆客串一番。

![手工繪製的流程圖][foo]

基於以上草圖,用 Snail 繪製流程圖,結果爲:

![Snail 繪製的流程圖][bar]

……

[foo]: 圖片/簡書的本地化/01.png
[bar]: 圖片/簡書的本地化/02.png 

之所以使用這種語法,是因爲將文檔發佈到簡書網站時,文檔裏的插圖只能逐一手動上傳。引用式插圖語法便於插圖手動連續上傳,而且只需要對圖片列表略作修改,文檔的正文部分無需變動。例如,將上述 Markdown 文檔裏出現的兩幅插圖上傳到簡書之後,只需要手動修改圖片列表部分的圖片地址,即

……

首先應該用鉛筆在紙上繪製草圖。不過,我沒找到鉛筆,好不容易找到了一支中性筆客串一番。

![手工繪製的流程圖][foo]

基於以上草圖,用 Snail 繪製流程圖,結果爲:

![Snail 繪製的流程圖][bar]

……

[foo]: https://upload-images.jianshu.io/upload_images/11203728-712932ca019321a5.png
[bar]: https://upload-images.jianshu.io/upload_images/11203728-35f7f76e6c3df5dc.png

雖然有些繁瑣,但是值得啊,再不濟,也是學了 Markdown 引用式插圖方式。

文章發佈

簡書本地化之後,要控制自己,永遠不要捨近求遠。文章的撰寫、審閱、修改甚至預覽等工作都在本地進行。之後,將文章發佈到簡書。

所謂發佈,無非是在簡書上,新建一篇文章,然後將本地的 Markdown 文檔內容複製過去,然後由簡書執行文章的發佈。也許還有自動化程度更高的辦法,但是我不懂網絡編程,也不知道簡書有沒有提供網絡接口以供本地程序調用。

倘若文章的內容裏沒有插圖,上述過程即使手動進行,也無非是複製、粘帖、發佈,近乎不廢吹灰之力。麻煩之處還是在於有插圖的文章。使用 Markdown 的引用式插圖語法,雖然僅需要修改插圖地址,但是若插圖較多,工作量也不容小覷。倘若有個好用的文本編輯器,再足夠自律,總是將插圖的文件名與引用名相同,這個工作就會好做一些。下面是我的做法。

在簡書上新建文章之後,首先不急於將文檔內容複製過去,而是先用簡書的編輯器上傳所有插圖,於是簡書的編輯器裏會出現類似下面的插圖列表:

![foo.png](https://upload-images.jianshu.io/upload_images/11203728-22a5ea9d16a8c1da.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

![bar.png](https://upload-images.jianshu.io/upload_images/11203728-a26c53d305a61e9d.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

![xxx.png](https://upload-images.jianshu.io/upload_images/11203728-50bc5a679b288b7a.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

……

其中,foo.pngbar.pngxxx.png 皆爲位於本地的插圖文件名。簡書的編輯器默認將本地圖片文件名作爲插圖名,然後自動生成 Markdown 普通的插圖代碼。我需要利用這一點,使用 Emacs 更快速的生成像下面這樣的引用式插圖列表:

[foo]: https://upload-images.jianshu.io/upload_images/11203728-22a5ea9d16a8c1da.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240
[bar]: https://upload-images.jianshu.io/upload_images/11203728-a26c53d305a61e9d.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240
[xxx]: https://upload-images.jianshu.io/upload_images/11203728-50bc5a679b288b7a.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240
……

要達到上述目的,首先將簡書生成的圖片列表複製到 Emacs 編輯器新建的一份臨時性的空文件裏——Linux 環境,可在 /tmp 目錄創建這份文件。然後在 Emacs 裏,將光標移動到文章開始位置,然後執行 [4]

M-x replace-regex <RET> \!\[\(.*\).png\](\(.*\)) <RET> [\1]: \2 <RET>
M-x flush-lines <RET> ^$ <RET>

便可得到引用式圖片列表,將其複製到簡書編輯器,替換簡書產生的圖片列表即可。然後將本地文檔內容複製到簡書上的引用式圖片列表之前,再發布,如此便完成了內容含有插圖的文章的發佈。

再次提醒,採用上述辦法生成引用式圖片列表的前提是,文檔內容中使用的插圖引用名需要與插圖的文件名相同。例如,對於上述示例,在正文中必須使用 foobarxxx 作爲插圖引用名。

預覽

如果像我一樣,操作系統是 Gentoo Linux,可爲 Emacs 安裝 Portage 提供的 markdown-mode:

$ sudo emerge -avt markdown-mode

然後,使用 Emacs 打開擴展名爲 .md 的文件時,便會自動開啓 Markdown 模式。

倘若想在本地預覽 Markdown 文檔,可使用 pandoc 程序 [5],將 Markdown 文檔轉化爲 HTML 文件並提交於 Emacs 默認的網頁瀏覽器。在 Gentoo Linux 裏安裝 pandoc,只需

$ sudo emerge -avt pandoc

但是這個安裝命令引發的可能是個大工程,因爲 pandoc 是使用 Haskell 語言編寫的,要安裝它,需要爲它安裝 Haskell 生態環境,100 多個軟件包,其中最爲費時的應該是編譯 ghc——大概需要 3 個小時方能編譯成功。

有了 pandoc 之後,在 Emacs 的初始化配置文件增加以下設定:

;; markdown 預覽
(setq markdown-command "/usr/bin/pandoc") 

然後重新開啓 Emacs,在撰寫 Markdown 文檔的過程中,使用 C-c C-c p 便可在網頁瀏覽器裏呈現預覽結果。

pandoc 是一個神器。即使不用 Emacs,單獨使用 pandoc,也有很多奇妙的用法。

待續

這是一個長期的工程。等日後遇到問題,再更新這份文檔。


  1. 我寫過一篇 Emacs 入門文檔,詳見「走近 Emacs」。

  2. 確切地說,簡書僅支持 Markdown 標記的一個子集。一些在我看來很有用的 Markdown 語法,例如內嵌 HTML 標記、文檔目錄、錨點等語法,簡書不支持。

  3. 我用的是 Linux 系統。對於其他類型的操作系統,有不同的腳本格式和系統 PATH 變量設定方法。

  4. 若熟悉 ELisp 編程,不難將這些命令封裝爲 ELisp 函數,從而進一步使操作得以大幅簡化。

  5. https://pandoc.org/MANUAL.html

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章