時間:2018-03-24
作者:魏文應
一、說明
Atom 這個軟件是開源免費的,由業界良心 Github 推出,插件功能強大。我用過 Sublime 編輯器,相對來說 Atom 安裝插件更方便,界面也很好看。目前我主要用 Atom 來做以下事情:
- 寫 Markdown : 在本地端寫 Markdown 文檔,妥妥的,寫好以后通過 Git 保存到云端。
-
導成 PDF: 將 Markdown 導出生成PDF,目前來看(2018-09-12),Atom 導出的 PDF, 要比另外一款叫做 VScode 的編輯器導出的 PDF 好看。VScode 導出的PDF中文字體有問題,有粗有細:對比生成的PDF
值得注意的是,目前(2018-09-12),微軟收購了 Github 公司,微軟 VScode 編輯器和 Atom 編輯器有很多相似的地方,后續看 Atom 如何升級維護也是一個問題。但如果你只是寫 Markdown ,依然推薦你使用 Atom 這個軟件。
二、安裝環境
下面是我測試的安裝的系統環境和軟件版本,其實 Atom 安裝很容易,一鍵傻瓜式安裝就可以了。
- 操作系統:windows 7 64bit
- Atom 版本:Atom 1.25.1
三、安裝Atom
-
到 Atom官網 下載 Atom 安裝包:
下載頁面
四、Atom中的插件管理
Atom 編輯器具有很強的可擴展性,這些擴展性是通過安裝插件的形式實現的。所以,當你想用一個新的功能時,你可能需要安裝插件。
安裝插件
安裝插件,依次點擊:
File
->Settings
->Install
- 安裝軟件的界面
在 Install 安裝軟件的界面里,你可以聯網 搜索你需要的插件,然后點擊后面的 Install 按鈕安裝即可。
查看已安裝的插件
如何查看 已經安裝有哪些插件 呢? 可以點擊 File
-> Settings
-> Packages
,就會列出你已經安裝有哪些插件:
- 已經安裝的插件
如果你想 禁用某個插件,點擊對應插件后面的 Disable
即可,當顯示為 Enable
時為禁用狀態。你可以再次點擊 Enable
啟用插件 。如果想卸載創建,可以點擊對應插件的 Uninstall
按鈕。注意:有些時候,禁用和啟用插件,需要重啟 Atom 編輯器才可以生效。
下載的插件在哪呢?
有時候,我們想保存下載下來的插件包,并打包分發到其它電腦上,這樣就不用重新下載插件了。對于沒有網絡的內網來說比較用。安裝插件時,下載的包都在 .aton/packages ,文件夾 .aton 是隱藏文件。這個目錄一般在用戶目錄下:
C:\Users\331075\.atom\packages
比如我的用戶名為 331075
,默認就在上面這個目錄下:
- 插件包的位置
插件的快捷鍵
當我們安裝了相應的插件,如何知道它 快捷鍵 呢?其實從一級菜單的 Packages
中,我們也能看出安裝了哪些插件,鼠標移動到相應的創建,就能做相應的操作,而且還列出了相應的快捷鍵。
- 查看插件快捷鍵
比如上面的 Markdown to PDF
這個插件(你可能還沒有安裝這個插件,你看一下其它的),你除了可以直接點擊它,讓它生成 PDF ,也可以按照它提示的快捷鍵 Ctrl + Shift + C
來執行生成 PDF 。
五、使用 Atom 編輯 Markdown 文檔
如果你想使用 Atom 編輯 Markdown 文檔,那么就需要安裝 Markdown 相關的插件。接下來,我將演示如何安裝這些插件。
安裝 Markdown 插件
安裝 Markdown 插件之前,我們先 禁用 Atom 自帶的 Markdown 插件,因為自帶的插件功能不夠強大。查看已安裝插件列表: File
-> Settings
-> Packages
,找到 markdown-preview
這個插件(事實上,默認安裝了的插件比較多,不容易找到,你應該在搜索框中輸入markdown-preview
,進行搜索查找),找到以后,點擊 Disable
禁用它:
- 禁用默認的 markdown-preview 插件
接下來點擊 Install
選項,在對話框中輸入 markdown
,然后點擊 Packages
進行搜索,會出現一些與 markdown 相關的插件:
- 插件安裝的界面
在上面這個 Install 安裝插件界面的搜索框中,搜索并安裝下面的插件(注意:安裝前,先看后面的 “六、插件安裝注意事項”):
搜索的插件名稱 | 作用 | 安裝 |
---|---|---|
markdown-preview-plus |
增強版的預覽功能 | 點擊對應的 Install 按鈕 |
markdown-image-pase |
支持直接粘貼圖片到文檔中 | 點擊對應的 Install 按鈕 |
language-markdown |
對應 Markdown 語法進行高亮顯示 | 點擊對應的 Install 按鈕 |
markdown-pdf |
生成 Markdown PDF 文檔 | 點擊對應的 Install 按鈕 |
安裝完成以后,就可以在 Packages
插件列表中,看到我們安裝的插件了。注意:插件的安裝,有時需要重啟 Atom 編輯器才可以生效 。
編輯 Markdown 文檔
首先創建一個 Markdown 文件,Markdown 文本文件的 文件后綴名 為 .md
:
- markdown 后綴名
使用 Atom 打開這個文件,并編寫 Markdown 文檔(前提是你會 Markdown 語法):
- markdown 顯示效果!
上面就是 Markdown 的顯示效果,左邊是 Markdown 原文,右邊是顯示效果。右邊稱為 預覽,鼠標放在原文區域,同時按下 Shift + Ctrl + M
快捷鍵,就可以 打開預覽窗口 了。
Markdown 生成 PDF 文檔
Markdown 生成 PDF 比較簡單,如果你安裝了 markdown-pdf
插件,鼠標放在目標 Markdown 編輯區域,按下 Shift + Ctrl + C
快捷鍵即可,過一會就會在當前文件夾目錄下生成 PDF 文件了。
- 生成PDF
Markdown 支持 Latex 公式
LaTex 公式是用于編寫數學公式的,比如,Markdown 源文件中你這么寫:
$$ S = \int_{a}^b f(x) \mathrmcrf6fkyx = F(b) - F(a) $$
Markdown 就會顯示這樣:
LaTex 語法是獨立,本來和 Markdown 語法沒有半毛錢關系。但是我們經常要用到數學公式,這時就需要有個支持 Markdown + LaTex
雙語法的插件。我們的 markdown-preview-plus
巧好滿足這樣的需求,在 File
-> Settings
-> Packages
中找到 markdown-preview-plus
這個插件,點擊這個插件的 Settings
,設置插件:
- 支持數學公式的選項
將這個支持 Latex 數學公式的 Enable Math Rendering By Default
選項勾選上,這樣就支持數學公式了(需要重啟一下 Atom 編輯器)。當然也要看一下快捷鍵功能是否打開,如果沒有打開則打開快捷鍵功能,將下面 Enable
勾選上就可以了:
- 使能Keybinding
Markdown 粘貼圖片
安裝了 markdown-image-paste
插件,就可以使用 Ctrl + V
快捷鍵粘貼圖片了。不過這個圖片必須處于編輯狀態,比如通過 QQ 截圖,然后直接粘貼就可以:
- 直接 Ctrl + C 粘貼
截圖后,直接 Ctrl + C
粘貼就可以了(不需要另存為,截圖時,截圖軟件已經將圖片自動復制到粘貼板上了)。粘貼后就會在 Markdown 源文件中這么表示圖片:

然后你可以在當前文件夾目錄下,看到一個圖片文件:
- 截圖的圖片文件
不過,我們必須在文件夾中,修改這個圖片文件的名稱,比如修改為 圖片1.png
,然后在 Markdown 源文件中也這樣修改:

在中括號 [ ]
中,可以寫上圖片小標題,比如上圖中的 截圖的圖片文件
這幾個字:

如果你不修改圖片名稱,下次粘貼時,新圖片會覆蓋原來名為 .png
這圖片,導致原來的圖片沒有了。而且在預覽中,是 看不到 截圖的圖片文件
這幾個字的 ,只有在網頁中才能看到。如果你直接選中文件夾中的某個圖片,復制粘貼,你會發現在 Markdown 源碼文本中死活粘貼不了,這就是我們剛才說的,圖片必須處于編輯狀態才可以直接粘貼。如果你有了一個圖片文件,直接復制到和 Markdown 文檔同一個目錄下,然后通過這個文件名引用圖片就可以了。當然,Markdown 中的圖片是支持相對路徑的:

上面的寫法意思是,圖片在當前 Markdown 文件的上一層目錄中,這樣做的好處就是,我們所有的圖片可以單獨放在一個文件夾中。
六、插件安裝注意事項
markdown-pdf 插件安裝問題
在安裝 markdown-pdf
插件之前,需要先添加 phantomjs
相應目錄下 。到 phantomjs
官網下載 phantomjs 軟件包 ,官網網址如下:
將下載壓縮包解壓以后,復制其內容到下面的文件夾內(C:\Users\331075
我的用戶名,剩下的部分是一樣的):
C:\Users\331075\.atom\packages\markdown-pdf\node_modules\phantomjs-prebuilt
如果你沒有安裝過 markdown-pdf ,那么你可能沒有這個路徑,可以手動相應文件夾:
markdown-pdf\node_modules\phantomjs-prebuilt
- 復制粘貼的 phantomjs-prebuilt 的內容
如果已經安裝了 markdown-pdf,卻不能使用,就先卸載 markdown-pdf,再安裝 phantomjs,然后安裝 markdown-pdf,就可以正常使用了。為什么要用 phantomjs 呢? phantomjs 是一個 WebKit 瀏覽器引擎,有相應的 CSS 選擇器,PDF 顯示時,需要用到這個瀏覽器引擎。
七、離線安裝 Atom 插件
因為國內有墻的存在,如果沒有科學上網,那么,你很能在線安裝不成功。這時候,你需要離線安裝 Atom 插件。離線安裝前,你需要安裝下面兩個軟件:
Git 工具 : https://git-scm.com/download/win 。
Node.js 工具 : https://nodejs.org 。
下面,我以安裝 markdown-image-paste 插件為例,演示如何離線安裝插件。
下載離線包
我們要先找到這個插件的 Github 地址,然后從 Github 網站上下載這個插件。在 Atom 編輯器的 Install 中,搜索找到這個插件,點擊它:
- 找到對應插件
就能看到它上面的 github 地址:
- 點擊進入下載頁面
然后在 github 頁面找到下載地址:
- 點擊Clone or download 查看下載地址
然后打開電腦的 cmd 終端進入 C:\Users\331075\.atom\packages
(其中 331075 是用戶名,請根據你的電腦用戶名而定)。在這個目錄下,執行下面命令下載你需要的插件:
下載完成后,就會在 C:\Users\12093\.atom\packages
這個目錄下,生成一個名為 markdown-image-paste
文件夾,這個就是我們剛才下載的插件:
- 下載插件的目錄
離線包安裝
離線包已經下載下來了,剛才下載的是 markdown-image-paste
,進入這個文件夾,并執行以下命令:
npm install
- 下載并安裝
然后,重啟 Atom 編輯器,就能在 packages 里看到剛才安裝的 markdown-image-paste 這個插件了。不過這么安裝,發現一個問題,就是點擊 Disable 那個按鈕沒有反應,也沒有 Settings 選項:
- disable按鈕沒有反應
八、其它有用插件
-
simplified-chinese-menu
插件: Atom 中文插件,可以使 Atom 菜單文字為中文顯示。