Atom+Asciidoctor+Antora環境搭建

個人博客原文鏈接

Atom

簡介

Atom是github專門爲程序員推出的一個跨平臺文本編輯器。具有簡潔和直觀的圖形用戶界面,並有很多有趣的特點:支持CSS,HTML,JavaScript等網頁編程語言。它支持宏,自動完成分屏功能,集成了文件管理器。

安裝【windows7】

1.下載
官網鏈接
2.安裝
3.配置環境變量
path中添加C:\Users\Administrator\AppData\Local\atom\bin
4.檢測環境變量是否配置成功
5.打開cmd,使用apm命令查看
6.介紹atom界面

  • File 文件和項目的保存與加載,設置中心,用戶自定義配置
  • Edit 文件編輯的操作,文件編碼格式,及行跳轉等
  • View 重載頁面,全屏,字體大小的縮放等
  • Find 都是關於查詢的 ,跟Sublime text極其相似,快捷鍵基本一樣
  • Package 包,就是插件列表的集合點
  • Help 幫助文檔,軟件更新,協議等

7.更改主題
打開Settings,在Themes頁面選擇即可
8.安裝插件

  • 直接安裝
    打開Settings,在Install頁搜索插件名稱,點擊Install即可
  • 通過git手動安裝
    打開Settings,在Install頁搜索插件名稱
    點入插件介紹找到github地址
    打開git切換到packages目錄C:\Users\Administrator\AppData\Local\atom\packages
    輸入指令git clone https://github.com/emmetio/emmet-atom.git
    切換到安裝的插件文件夾cd emmet-atom
    開始安裝npm install
    重啓Atom

9.自定義快捷鍵
File -> 打開keymap.cson文件

Asciidoctor

簡介

Asciidoctor是一個快速的文本處理器和發佈工具鏈,用於將AsciiDoc內容轉換爲HTML5、EPUB3、PDF、DocBook 5(或4.5)slidedeck等格式。Asciidoctor是用Ruby編寫的,打包爲RubyGem併發布到(RubyGems.org)。gem還打包在幾個Linux發行版中,包括Fedora、Debian和Ubuntu。

安裝【windows7】

1.準備Ruby環境
下載安裝並配置環境變量【若勾選自動添加到path則可略過】
下載鏈接
檢測是否安裝成功
在命令行輸入:ruby -v
2.安裝asciidoctor
在命令行輸入:gem install asciidoctor
3.檢測是否安裝成功
在命令行輸入:asciidoctor --version
4.如果需要繪製圖表,還需要安裝asciidoctor-diagram
在命令行輸入:gem install asciidoctor-diagram
5.從asciidoc文檔生成html文檔(DEMO)
在命令行輸入:asciidoctor -r asciidoctor-diagram xxx.adoc

Antora

簡介

Antora可以很容易地創建文檔並將其發佈到web上。作爲一名技術作者,您只需使用AsciiDoc (Antora的內容標記語言)編寫內容。然後將這些文件組織到一個或多個內容存儲庫中的標準項目結構中。Antora從那裏獲取您的內容並將其轉換爲網站。

安裝【winodws7】

1.準備Node環境
檢測是否有node.js
打開命令行cmd,輸入:node --version
如果沒有返回版本信息則要去官網下載Node
官網鏈接
安裝並配置環境變量,再檢測是否安裝成功
> 注:如果版本過低,可以去官網下載最新版本,然後安裝覆蓋原目錄即可實現更新
2.開始安裝antora
打開命令行cmd,輸入:npm i -g @antora/[email protected] @antora/[email protected]
命令解釋:包名開頭的@很重要。它告訴npm cli包位於antora組中。如果省略這個字符,npm將假定包名是GitHub上git存儲庫的名稱。第二個@抵消了請求的版本號。只指定主要和次要部分,以確保您接收到最新的補丁更新。
3.檢測是否安裝成功
在命令行輸入:antora version

簡單的使用流程

1.選擇一個劇本
要創建文檔站點,Antora需要一個劇本。但首先,您需要創建或選擇一個目錄,在其中存儲劇本,並保存生成的站點文件(假設使用默認輸出配置)。
a.打開終端並創建一個名爲demo-site的新目錄。
mkdir demo-site
b.進入到該目錄中
cd demo-site
c.使用文本編輯器或IDE,創建一個名爲site的新劇本文件。用下面示例的內容填充它。
site.yml

site:
  title: Antora Demo Site
  url: https://example.org/docs 
  start_page: component-b::index.adoc 
content:
  sources:
  - url: https://gitlab.com/antora/demo/demo-component-a.git
	branches: master
  - url: https://gitlab.com/antora/demo/demo-component-b.git
	branches: [v2.0, v1.0]
	start_path: docs
ui:
  bundle:
	url: https://gitlab.com/antora/antora-ui-default/-/jobs/artifacts/master/raw/build/ui-bundle.zip?job=bundle-stable
	snapshot: true

注:404頁面和站點地圖文件僅在站點生成時生成。設置url屬性。
注:該網站。site.start_page屬性接受與xref中使用的相同的頁ID語法。
d.將site.yml劇本作爲站點保存

2.運行Antora
a.要使用默認的Antora站點生成器生成站點,請將Antora命令指向您的playbook文件。在終端輸入命令
antora site.yml
> 注:首先,Antora將克隆內容存儲庫。終端顯示每個存儲庫的克隆進度。克隆完成後,Antora將AsciiDoc頁面轉換爲可嵌入的HTML,在UI頁面模板中包裝HTML,然後將這些頁面組裝到目標文件夾下的站點中,默認構建目錄bulid/site/。
b.當命令提示符($)重新出現在終端時,Antora已經運行完成。
c.切換到站點文件夾(cd)並列出其內容。
cd build/site/
ls -l
然後你將看到以下文件或目錄列表
_ 404.html component-a component-b index.html sitemap-component-a.xml sitemap-component-b.xml sitemap.xml
> 注:如果站點不存在,404.html和sitemap文件將丟失。劇本中沒有定義site.url屬性。主sitemap文件實際上是一個sitemap索引。該文件鏈接到每個組件的sitemap,在這裏可以找到各個頁面的URL。
d.在某些操作系統上,可以通過輸入open和HTML文件的名稱,直接從命令行打開站點。
open index.html
> 注:或者可以直接通過build/site/index.html打開站點

3.緩存
a.當Antora第一次運行時,它將在緩存目錄中緩存資源。Antora緩存兩種類型的資源:克隆的git存儲庫和UI包下載。
b.如果您想完全清除緩存,您需要找到系統上的Antora緩存目錄並刪除它。

4.私人git倉庫
a.Antora支持通過SSH或HTTP/HTTPS來連接私有倉庫。 b.如果劇本被配置爲通過SSH獲取私有存儲庫,那麼您必須運行具有標識的SSH代理(即您已經鏈接到git主機上的帳戶。如果SSH代理沒有運行,或者您的密鑰和帳戶不匹配,Antora在嘗試克隆私有存儲庫時將失敗。

5.本地預覽
a.因爲Antora生成靜態站點,所以不需要爲了預覽站點而將站點發布到服務器,可以直接通過build/site/index.html打開站點
b.也可以在本地服務器上運行,需要先使用npm全局安裝服務包
npm i -g [email protected]
現在,通過將web服務器指向生成的站點的位置來啓動它
serve build/site
將提供的URL粘貼到瀏覽器的位置欄中,以便通過本地web服務器查看站點。
6.發佈到github頁面
注意事項:避免站點發布到github page被刪除UI相關文件內容,解決方案是將.nojekyll文件添加到已發佈站點的根目錄中。在將文件提交到GitHub頁面之前,只需在輸出目錄中創建一個空的.nojekyll文件。

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