gitbook 入門教程之從零到壹發佈本身的插件

什麼是插件

Gitbook 插件是擴展 Gitbook 功能的最佳方式,若是 Gitbook 沒有想要的功能或者說網絡上也沒有現成的解決方案時,那麼只剩下自食其力這條道路,讓咱們一塊兒來自力更生開發插件解決問題吧!html

幸運的是,Gitbook 提供了插件機制留給開發者去擴展自定義功能,雖然官方開發文檔不是特別完善,甚至有時候須要翻閱相關源碼才能定位到暴露出的 api,可是這一切都不影響開發的熱情,誰讓咱們一開始就選定了 Gitbook 呢!git

copyright-dev-zero2one-gitbook-index.png

遺憾的是,目前 Gitbook 已經中止了舊版服務,gitbook-cli 腳手架甚至也早已中止了維護,可是我心依舊鐘愛於輕量級的腳手架,不拋棄不放棄,因此花費了必定心血整理出相關的資料文檔.github

「雪之夢技術驛站」: Gitbook 官方文檔移植項目,包括 原版英文和校準中文,歡迎各位愛好者加入一塊兒維護!
「雪之夢技術驛站」: 從入門到熟練運用系列文章, 高級進階章節詳細介紹了插件開發的基礎知識,淺顯易懂全是乾貨!
「雪之夢技術驛站」: 基於 gitalk 實現的 Gitbook 插件,詳細介紹了 從思路到實現的全過程,二次封裝第三方工具時值得借鑑.
「雪之夢技術驛站」: 基於 readmore 實現的閱讀更多插件,基於 模板渲染手段封裝第三方工具,和 mygitalk 插件的實現思路 互爲補充!

爲何作插件

「雪之夢技術驛站」: 由於沒有現成插件,因此自力更生,由於力有所及,因此開源!

若是你和我同樣全平臺發佈文章的話,估計你也會遇到和我同樣的問題: 原創首發我的博客後轉載自其餘各大平臺,爲了吸引流量老是要添加原創聲明小尾巴,麻煩且費事!npm

github
wechat
今日頭條
Bilibili
慕課網
簡書
csdn
博客園
掘金
思否
開源中國
騰訊雲社區

當一次又一次重複這種無心義的勞動時,天然要尋求解決之道,偷懶是促進生產力發展的原始動力!json

如今問題很清楚了,那就是須要開發一款 Gitbook 插件幫助文章自動添加版權保護信息,來減小人力勞動.segmentfault

幸運的是,在平時逛的各大平臺中慕課網和CSDN自帶版權保護,所以不妨來個強強聯合,開發出加強版版權保護插件.api

  • 慕課網版權聲明
做者:雪之夢技術驛站
連接:https://www.imooc.com/article/293112
來源:慕課網

copyright-dev-zero2one-imooc-copy-and-paste.png

「雪之夢技術驛站」: 慕課網手記文章複製內容時會自動追加版權保護信息,包括做者,連接和來源三部分.
  • CSDN 版權聲明
版權聲明:本文爲博主原創文章,遵循 CC 4.0 BY-SA 版權協議,轉載請附上原文出處連接和本聲明。
本文連接:https://snowdreams1006.blog.csdn.net/article/details/102077796
————————————————
版權聲明:本文爲CSDN博主「雪之夢技術驛站」的原創文章,遵循 CC 4.0 BY-SA 版權協議,轉載請附上原文出處連接及本聲明。
原文連接:https://snowdreams1006.blog.csdn.net/article/details/102077796

copyright-dev-zero2one-csdn-copyright-protect.png

「雪之夢技術驛站」: CSDN原創博客開頭自動追加版權聲明信息,包括版權聲明和本文鏈兩部分,複製版權信息時會追加版權保護信息.
  • 強強聯合的版權保護插件聲明

慕課網手記文章全文複製均會追加版權保護信息,而 CSDN原創博客開頭顯示版權信息複製該信息時纔會追加版權保護信息,綜合二者,不妨作個加強版版權保護插件.bash

做者: 雪之夢技術驛站
連接: https://snowdreams1006.github.io/myGitbook/advance/plugin-develop.html
來源: 雪之夢技術驛站
本文原創發佈於雪之夢技術驛站,轉載請註明出處,謝謝合做!

copyright-dev-zero2one-plugin-plus-protect.png

「雪之夢技術驛站」: 文章末尾自動追加版權聲明信息,複製任意文章內容時自動追加版權保護信息.

怎麼快速作插件

根據插件的實現效果,咱們暫且將該插件命名爲 copyright 版權插件,接下來就是趕忙公開註冊插件以避免名字被搶先一步!服務器

「雪之夢技術驛站」: 暫時並不着急於實現插件的做用,搶佔先機很重要,小步快跑去註冊插件吧!
「雪之夢技術驛站」:註冊過程比較簡單,用戶名和郵箱之類的信息便可,不用付費也能夠發佈包.
  • 命令行運行 npm adduser 註冊
$ npm adduser
「雪之夢技術驛站」: 終端註冊和網頁版註冊基本一致,須要用戶名,密碼和郵箱.

查詢插件名稱

按照 Gitbook 插件命名規範,實用性插件必須gitbook-plugin-* 開頭,而咱們的插件名爲 copyright ,由於完整名稱應該是 gitbook-plugin-copyright .網絡

  • 命令行中按照關鍵字搜索插件名稱
$ npm search --keyword gitbook-plugin-copyright
「雪之夢技術驛站」: 若是沒有搜索到項目,恭喜你,名稱可用,抓緊時間趕忙註冊!不然,從新起名,直到可用爲止!
  • npmjs 官網在線搜索插件名稱

按照關鍵字搜索: https://www.npmjs.com/search?q=gitbook-plugin-copyright

copyright-dev-zero2one-npmjs-search-no-result.png

「雪之夢技術驛站」: 若是沒有出現精確匹配 exact match,恭喜你,名稱可用,請抓緊時間註冊插件.不然另想新名,直到名稱可用爲止!

建立開源項目

通過上一步查詢後肯定插件名稱暫時可用後,應該當即前往 github 建立與插件同名的開源項目,以便進行插件的後續更新維護.

  • 建立開源項目

copyright-dev-zero2one-github-create-project.png

「雪之夢技術驛站」: 建立插件項目時,建議 項目信息儘可能補全,添加 README 文件和版權類型.
  • 克隆到本地項目

copyright-dev-zero2one-github-clone-project.png

「雪之夢技術驛站」: 點擊 克隆或下載按鈕獲取克隆連接,準備下載到本地繼續開發插件項目.
$ git clone git@github.com:snowdreams1006/gitbook-plugin-copyright.git
  • 初始化 npmjs 項目

克隆到本地工做空間後,切換到插件項目目錄,運行初始化npm項目命令,生成默認 package.json 配置文件.

$ npm init -y
「雪之夢技術驛站」: 默認信息基本夠用,暫時沒必要修改,重點是 快速搶佔插件名稱!
  • 發佈 npmjs 項目
$ npm publish
「雪之夢技術驛站」: 發佈 npmjs 包時應該先登陸帳號 npm login,並設置爲 npmjs 官方鏡像源, npm set registry https://registry.npmjs.org/ .

成功搶注插件

若是命令行內運行 npm publish 命令發佈插件沒有報錯信息,恭喜你!插件應該成功發佈到 npmjs 包註冊中心!

  • 驗證插件是否發佈成功

若是發佈插件時命令行沒有報錯,不管是在命令行內搜索插件仍是網站內搜索插件,此時就應該能搜索到剛剛發佈成功的插件.

$ npm search --keyword gitbook-plugin-copyright
「雪之夢技術驛站」: 命令行內再次運行 npm search --keyword gitbook-plugin-copyright 發現插件已成功搶注!

copyright-dev-zero2one-npmjs-search-have-result.png

「雪之夢技術驛站」: 搜索到的插件名稱正是剛剛發佈成功的插件,此時插件名稱 gitbook-plugin-copyright 已成功搶注!

點擊插件名稱跳轉到插件介紹頁面,基本框架已初具模樣,接下來的工做纔是真正的插件開發.

copyright-dev-zero2one-npmjs-plugin-detail-preview.png

「雪之夢技術驛站」: 此時插件已成功發佈到 npmjs 包管理中心,任何人都使用 npm install gitbook-plugin-copyright 安裝插件,只不過暫時並無任何代碼邏輯而已!

如今雖然插件已發佈到 npmjs 包管理工具,可是源代碼尚未上傳到遠程服務器,沒法進行後續的開源維護,所以此時建立一個里程碑,記念下難忘的時刻並準備同步到 github.

  • 首先,本地建立 v0.0.1 版本
$ git tag v0.0.1 -m "init"
  • 而後,推送到遠程服務器
$ git push origin v0.0.1

copyright-dev-zero2one-github-tag-preview.png

下載地址: https://github.com/snowdreams1006/gitbook-plugin-copyright/releases
  • 最後,順便更新主幹 master 分支
$ git push origin master

至此,從建立插件到發佈插件以及最後同步插件源碼所有流程基本完成,從零到壹開發插件併發布就是這麼簡單!

相關總結和預告

本文主要介紹了如何從0到1發佈本身的插件,雖然只是骨架,具體什麼代碼也沒有,可是對於完整的開發流程而言已經足夠了!

相信你也不會重複開發一個如出一轍的 gitbook-plugin-copyright 插件,因此具體代碼對於讀者而言可能沒有特別大的用處.

可是經過本文咱們能夠了解到,開發插件其實並不難!

實際開發中大多數問題網絡上基本上都有現成的解決方案,只須要學會搜索外加擁有必定的學習能力,相信你最終也必定能夠開發出本身的插件.

copyright-dev-zero2one-plugin-plus-protect.png

npmjs 相關命令

  • 註冊帳號
$ npm adduser
「雪之夢技術驛站」: 命令行內註冊信息比較簡單,不如網頁版註冊還能夠設置頭像之類的,推薦網頁版註冊.
  • 登陸帳號
$ npm login
「雪之夢技術驛站」: 不論哪一種註冊方式, 發佈插件前都要先登陸帳號以確認插件做者信息.
  • 查看當前用戶
$ npm whoami
「雪之夢技術驛站」: 顯式登錄後確定知道剛纔已經登陸, 一段時間後還記得是誰在登錄嗎?此時,運行該命令就能夠查看當前登陸用戶信息.
  • 建立 npmjs 包
$ npm init -y
「雪之夢技術驛站」: 默認建立的配置文件 package.json 基本夠用,也能夠自行修改相關配置信息.
  • 切換 npmjs 官方鏡像源
$ npm set registry https://registry.npmjs.org/
「雪之夢技術驛站」: 強制切換成官方鏡像源,主要是針對可能使用 淘寶鏡像源的用戶.
  • 發佈 npmjs 包
$ npm publish
「雪之夢技術驛站」: 發佈插件前請 確保已經登陸並切換到官方鏡像源,不然發佈會失敗!
  • 按關鍵字搜索 npmjs 包
$ npm search --keyword gitbook-plugin-<package>
「雪之夢技術驛站」: 發佈前未被註冊時是搜不到結果,發佈後的插件做者信息應該是當前用戶.

git 相關命令

  • 克隆到本地項目
$ git clone git@github.com:<username>/gitbook-plugin-<package>.git
  • 提交更改到本地版本庫
$ git commit -am "change log"
  • 建立本地標籤版本
$ git tag <version> -m "publish log"
  • 推送標籤到遠程服務器
$ git push origin <version>
  • 推送最新代碼到遠程主幹 master
$ git push origin master

若是你有什麼好的靈感或者想法,趕忙去搶注吧,畢竟名稱但是全局惟一獨一無二的呀!

下一節咱們將開始介紹如何給基本骨架注入生命力,使其變成真正的 Gitbook 插件,甚至實現 gitbook-plugin-copyright 插件功能!

開源項目: https://github.com/snowdreams1006/gitbook-plugin-copyright
若是本文對你有所幫助,不用讚揚,也沒必要轉發,直接點贊留言告訴鼓勵一下就能夠啦!

雪之夢技術驛站.png

相關文章
相關標籤/搜索