如何發(fā)布一個Atom的package

上次為大家介紹了package.json的內(nèi)容巡蘸,文件在nodejs是非常有用的,發(fā)布npm是必須使用的俭驮,那么這次給大家說說如何給github的親兒子編輯器Atom發(fā)布一個package回溺,以便于共享你的好工具,造福大家混萝。

簡單介紹下Atom遗遵,是github用nodejs編寫的一個編輯器,其實應(yīng)該主要使用了node-webkit的技術(shù)譬圣,如果感興趣瓮恭,可以下次給大家詳細(xì)分析。

此文章來源于官方文檔的翻譯和自己開發(fā)插件的一些心得 ---- https://atom.io/docs/v1.2.4/hacking-atom-package-word-count

Package Generator

創(chuàng)建一個package最簡單的方式就是使用atom里面的生成器厘熟,使用命令面板--command(window)+shift+P,輸入generator屯蹦,找到Package Generator:Generate Atom Package 這行命令,選擇即可绳姨,這個時候輸入你的package名字登澜,可以起一個高大上有逼格的名字。

屏幕快照 2015-11-26 下午5.47.50.png

看見atom幫你創(chuàng)建了一大堆的文件夾和文件飘庄,一般來說脑蠕,基礎(chǔ)包如下

my-package/
  keymaps/
  lib/
  menus/
  spec/
  styles/
  package.json
  README.md
  CHANGELOG.md
  LICENSE.md
  .gitignore

package.json

同樣,首先看 package.json 因為他涉及到你的發(fā)布和各種配置。跟npm的很像谴仙,但是有自己的東東

  • main : 這個是你執(zhí)行命令后進(jìn)入的主文件迂求,也就是入口文件,默認(rèn)是尋找index的晃跺,同時atom支持 coffee 和 js

  • styles :一個字符串?dāng)?shù)組聲明來讓atom加載樣式文件順序揩局,如果沒有,就順序的讀取styles文件夾里面的文件掀虎。

  • keymaps : 一個字符串?dāng)?shù)組聲明package需要加載的key map文件順序凌盯,如果沒有,按順序讀取keymaps文件夾的文件烹玉。

  • activationCommands :一個對象來聲明觸發(fā)你的package的行為驰怎,key是css選擇器形式,value是一個字符串?dāng)?shù)組聲明命令二打。知道規(guī)定的css 選擇器中一個觸發(fā)了县忌,才會載入你的package。

來看看下面的package.json長相:

{
  "name": "my-package",
  "main": "./lib/my-package",
  "version": "0.0.0",
  "description": "A short description of your package",
  "keywords": [
    ],
  "activationCommands": {
    "atom-workspace": "my-package:toggle"
    },
    "repository": "https://github.com/atom/my-package",
    "license": "MIT",
    "engines": {
      "atom": ">=1.0.0 <2.0.0"
    },
    "dependencies": {
    }
}  

你最先要確認(rèn)的事情是就填寫這些信息址儒,包括:name芹枷,description, repository, license莲趣。 剩下的可以邊做邊寫鸳慈。

Source Code

我們來看看我們主文件,也就是剛剛創(chuàng)建的my-package.coffee,如果你在package.json中main的屬性沒有填寫喧伞,就是用index文件了走芋,這跟瀏覽器解析url很相似。

這跟最高級別的模塊是一個單獨對象潘鲫,管理著你的package在atom的生命周期翁逞,無論你有其他多少的視圖和模塊,都被它管理溉仑。

看看這個模塊有哪些重要的方法:

  • activate(state): 這個必需的方法在你的package執(zhí)行的時候被調(diào)用挖函,如果你的模塊使用了serialize()方法,那么這個方法會傳遞狀態(tài)數(shù)據(jù)浊竟,在你最后一次窗口被序列化的時候怨喘。使用這個初始化工作流程在package開始時

  • serialize() :這個可選的方法在窗口被掛起的時候調(diào)用,允許你返回一個json表示你的組件狀態(tài)振定。當(dāng)窗口再次喚起的時候必怜,這個數(shù)據(jù)會傳遞給activate方法,這樣你就可以恢復(fù)你的視圖后频。

  • deactivate() :這個可選的方法也是被掛起的時候調(diào)用梳庆,如果你的package有監(jiān)聽任何文件或者保持外部的資源暖途,釋放他們在這個時候。如果你只是訂閱窗口內(nèi)的膏执,就不必關(guān)心了驻售。

Style Sheets

這個很簡單,就是你的package執(zhí)行的時候胧后,用到的樣式表而已芋浮,可以是css或者less。less更好壳快,比較推薦。

其實你不需要太多的css镇草,因為atom本身就提供了一個標(biāo)準(zhǔn)包給使用眶痰,你可以使用CMD+shift+P 然后 搜索 styleguide 或者 cmd+crtl+shift+G。

如果你有什么特別要求梯啤,可以使用這個style文件夾竖伯,記得添加package.json的路徑。

Keymaps

推薦使用常用的操作鍵來綁定擴展因宇,特別是你也新加了一個命令的時候七婴,在我們package里面,我們的keymaps/my-package.cson文件:

    'atom-workspace':
        'ctrl-alt-o': 'my-package:toggle'

這個意思就是你同時按下 crtl-alt-o的時候察滑,我們的package就會執(zhí)行toggle命令打厘,你可以更改這些綁定在這個文件。

所有的快捷鍵都在keymaps的文件目錄中贺辰,默認(rèn)是所有的文件都被載入的户盯,package.json文件中有個可選的keymaps選項可以指定哪些文件被載入

Menus

這個文件主要是定義菜單欄的,包括頂部的package菜單里面的選項饲化,和右鍵菜單選項莽鸭。和keymaps一樣可以在package.json里面配置指定文件。

然后就是開發(fā)我們的插件吃靠,這個比較復(fù)雜硫眨,主要是涉及到Atom內(nèi)部的各種API和機制,這次先不講巢块,先說其他的礁阁。

Basic Debugging

最簡單的就是使用 console.log 來調(diào)試,跟我們在瀏覽器一樣夕冲,因為node-webkit其實就一個瀏覽器氮兵。

使用alt-cmd-I 或者選擇菜單 View>Developer> Toggle Developer Tools

屏幕快照 2015-11-26 下午6.42.18.png

Testing

當(dāng)然我們還需要寫測試功能,所有的測試代碼在 spec目錄下面歹鱼,使用jasmine來測試泣栈,所以大家要熟悉下jasmine的語法,其實各種測試都差不多。

使用cmd-alt-ctrl-p或者Developer>Run Package Spec菜單開始執(zhí)行測試南片。一般來說都會有錯誤掺涛,如下所示:

屏幕快照 2015-11-26 下午6.48.23.png

你可以自己慢慢的修改測試代碼,保證通過疼进,同時保證自己的package代碼不錯薪缆。

Publishing

現(xiàn)在我們的package沒問題了,也測試通過了伞广,剩下的就是發(fā)布了拣帽,要注意一些小的細(xì)節(jié),要不發(fā)布很可能失敗嚼锄。

Prepare Your Package

  • package.json 一定要有 name减拭, description 和 repository字段

  • package.json 要有 version字段來表示版本號" 0.0.0"

  • package.json 會有 engines 來表示工作環(huán)境,一般就是 {"Atom":">=1.0.0 <2.0.0"}

  • 要有一個README.md文件在根目錄

  • 整個文件要在github上有自己的地址区丑,并且已經(jīng)提交

Publish Your Package

在你發(fā)布之前拧粪,最好去atom官網(wǎng)上找找會不會有跟你同名的package,如果有沧侥,你就只能修改名字可霎,確保沒有之后, 你就可以在你的目錄下 使用

    apm publish minor 

來發(fā)布你的package了

這個命令會做以下事情:

  1. 注冊一個package的名字在atom.io上宴杀,如果是第一次發(fā)布

  2. 更新version從package.json文件中癣朗,然后提交

  3. 創(chuàng)建一個新的 git tag 給這次提交

  4. 推送這個tag和分支到 github上

  5. 用新發(fā)布的version更新到 atom.io 上

如果你是第一次提交,可能會需要填寫你github的用戶名和密碼婴氮,這個你跟著guide走就行了斯棒,注意別填錯了,主要是數(shù)字別用小鍵盤主经。

term中顯示成功之后荣暮,你就可以在

      https://atom.io/packages/my-package

看到你的package的頁面了。記得編寫README.md的內(nèi)容給大家看罩驻。

說說 minor這個意思穗酥,其實publish后面跟的參數(shù)有三個選項的。

major: 表示給 apm 增加版本號的第一個數(shù)字惠遏,1.0.0 這樣子 git tag 也會是 v1.0.0

minor: 第二個數(shù)字砾跃, 0.1.0的含義

patch: 最后一個數(shù)字, 0.0.1的意思

這個是跟版本號管理對應(yīng)的节吮,一般數(shù)來 major對應(yīng)是往后兼容性的改變抽高,例如 修改默認(rèn)設(shè)置或者刪除功能, minor 一般就是添加一個小功能或者優(yōu)化透绩。 patch 就是修復(fù)小的bug翘骂。

以上就一個完整的atom package開發(fā)和發(fā)布的過程壁熄,主要參考官網(wǎng)的文檔,里面有我一定的心得碳竟。

同時 介紹我的新插件草丧,

https://atom.io/packages/vue-format

主要是最近開始寫 vue.js,然后webpack打包莹桅,使用.vue的文件方式昌执,結(jié)果沒有能格式化文件的插件,所以給atom寫了一個诈泼,這是 0.1.0的版本懂拾,有問題很正常,我后面還會慢慢優(yōu)化铐达,如果大家有興趣委粉,可以一起來優(yōu)化,或者給我提各種issue娶桦,歡迎交流

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市汁汗,隨后出現(xiàn)的幾起案子衷畦,更是在濱河造成了極大的恐慌,老刑警劉巖知牌,帶你破解...
    沈念sama閱讀 206,311評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件祈争,死亡現(xiàn)場離奇詭異,居然都是意外死亡角寸,警方通過查閱死者的電腦和手機菩混,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,339評論 2 382
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來扁藕,“玉大人沮峡,你說我怎么就攤上這事∫诟蹋” “怎么了邢疙?”我有些...
    開封第一講書人閱讀 152,671評論 0 342
  • 文/不壞的土叔 我叫張陵,是天一觀的道長望薄。 經(jīng)常有香客問我疟游,道長,這世上最難降的妖魔是什么痕支? 我笑而不...
    開封第一講書人閱讀 55,252評論 1 279
  • 正文 為了忘掉前任颁虐,我火速辦了婚禮,結(jié)果婚禮上卧须,老公的妹妹穿的比我還像新娘另绩。我一直安慰自己儒陨,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 64,253評論 5 371
  • 文/花漫 我一把揭開白布板熊。 她就那樣靜靜地躺著框全,像睡著了一般。 火紅的嫁衣襯著肌膚如雪干签。 梳的紋絲不亂的頭發(fā)上津辩,一...
    開封第一講書人閱讀 49,031評論 1 285
  • 那天,我揣著相機與錄音容劳,去河邊找鬼喘沿。 笑死,一個胖子當(dāng)著我的面吹牛竭贩,可吹牛的內(nèi)容都是我干的蚜印。 我是一名探鬼主播,決...
    沈念sama閱讀 38,340評論 3 399
  • 文/蒼蘭香墨 我猛地睜開眼留量,長吁一口氣:“原來是場噩夢啊……” “哼窄赋!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起楼熄,我...
    開封第一講書人閱讀 36,973評論 0 259
  • 序言:老撾萬榮一對情侶失蹤忆绰,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后可岂,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體错敢,經(jīng)...
    沈念sama閱讀 43,466評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 35,937評論 2 323
  • 正文 我和宋清朗相戀三年缕粹,在試婚紗的時候發(fā)現(xiàn)自己被綠了稚茅。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,039評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡平斩,死狀恐怖亚享,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情双戳,我是刑警寧澤虹蒋,帶...
    沈念sama閱讀 33,701評論 4 323
  • 正文 年R本政府宣布,位于F島的核電站飒货,受9級特大地震影響魄衅,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜塘辅,卻給世界環(huán)境...
    茶點故事閱讀 39,254評論 3 307
  • 文/蒙蒙 一晃虫、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧扣墩,春花似錦哲银、人聲如沸扛吞。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,259評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽滥比。三九已至,卻和暖如春做院,著一層夾襖步出監(jiān)牢的瞬間盲泛,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,485評論 1 262
  • 我被黑心中介騙來泰國打工键耕, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留寺滚,地道東北人。 一個月前我還...
    沈念sama閱讀 45,497評論 2 354
  • 正文 我出身青樓屈雄,卻偏偏與公主長得像村视,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子酒奶,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 42,786評論 2 345

推薦閱讀更多精彩內(nèi)容

  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理蚁孔,服務(wù)發(fā)現(xiàn),斷路器惋嚎,智...
    卡卡羅2017閱讀 134,599評論 18 139
  • 作者:王子亭 Atom 是 GitHub 在 2014 年發(fā)布的一款基于 Web 技術(shù)構(gòu)建的文本編輯器勒虾,我從 20...
    LeanCloud官方帳號閱讀 3,060評論 0 13
  • 發(fā)現(xiàn) 關(guān)注 消息 iOS 第三方庫、插件瘸彤、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關(guān)注 2017.06.26 09:4...
    肇東周閱讀 12,024評論 4 62
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 171,506評論 25 707
  • hbrczj閱讀 398評論 0 0