如何發布一個Atom的package

LancerComet 發布于2019-08-19 17:08 / 3072人閱讀

摘要：表示給增加版本號的第一個數字，這樣子也會是第二個數字，的含義最后一個數字，的意思這個是跟版本號管理對應的，一般數來對應是往后兼容性的改變，例如修改默認設置或者刪除功能，一般就是添加一個小功能或者優化。

原文是寫在簡書上面的，我現在搬過來了，這邊更新會稍慢點。

http://www.jianshu.com/p/98f99c20493c

上次為大家介紹了package.json的內容，文件在nodejs是非常有用的，發布npm是必須使用的，那么這次給大家說說如何給github的親兒子編輯器Atom發布一個package，以便于共享你的好工具，造福大家。

簡單介紹下Atom，是github用nodejs編寫的一個編輯器，其實應該主要使用了node-webkit的技術，如果感興趣，可以下次給大家詳細分析。

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

Package Generator

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

看見atom幫你創建了一大堆的文件夾和文件，一般來說，基礎包如下

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

package.json

同樣，首先看 package.json ?因為他涉及到你的發布和各種配置。跟npm的很像，但是有自己的東東

?main?：這個是你執行命令后進入的主文件，也就是入口文件，默認是尋找index的，同時atom支持 coffee 和 js

styles ：一個字符串數組聲明來讓atom加載樣式文件順序，如果沒有，就順序的讀取styles文件夾里面的文件。

keymaps ：一個字符串數組聲明package需要加載的key map文件順序，如果沒有，按順序讀取keymaps文件夾的文件。

activationCommands ：一個對象來聲明觸發你的package的行為，key是css選擇器形式，value是一個字符串數組聲明命令。知道規定的css 選擇器中一個觸發了，才會載入你的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": {
        }
    }

你最先要確認的事情是就填寫這些信息，包括：name，description, repository， license。剩下的可以邊做邊寫。

Source Code

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

這跟最高級別的模塊是一個多帶帶對象，管理著你的package在atom的生命周期，無論你有其他多少的視圖和模塊，都被它管理。

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

activate(state): 這個必需的方法在你的package執行的時候被調用，如果你的模塊使用了serialize()方法，那么這個方法會傳遞狀態數據，在你最后一次窗口被序列化的時候。使用這個初始化工作流程在package開始時

serialize() ：這個可選的方法在窗口被掛起的時候調用，允許你返回一個json表示你的組件狀態。當窗口再次喚起的時候，這個數據會傳遞給activate方法，這樣你就可以恢復你的視圖。

deactivate() ：這個可選的方法也是被掛起的時候調用，如果你的package有監聽任何文件或者保持外部的資源，釋放他們在這個時候。如果你只是訂閱窗口內的，就不必關心了。

Style Sheets

這個很簡單，就是你的package執行的時候，用到的樣式表而已，可以是css或者less。less更好，比較推薦。

其實你不需要太多的css，因為atom本身就提供了一個標準包給使用，你可以使用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就會執行toggle命令，你可以更改這些綁定在這個文件。

所有的快捷鍵都在keymaps的文件目錄中，默認是所有的文件都被載入的，package.json文件中有個可選的keymaps選項可以指定哪些文件被載入

Menus

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

然后就是開發我們的插件，這個比較復雜，主要是涉及到Atom內部的各種API和機制，這次先不講，先說其他的。

Basic Debugging

最簡單的就是使用 console.log 來調試，跟我們在瀏覽器一樣，因為node-webkit其實就一個瀏覽器。

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

Testing

當然我們還需要寫測試功能，所有的測試代碼在 spec目錄下面，使用jasmine來測試，所以大家要熟悉下jasmine的語法，其實各種測試都差不多。

使用cmd-alt-ctrl-p或者Developer>Run Package Spec菜單開始執行測試。一般來說都會有錯誤，如下所示：

你可以自己慢慢的修改測試代碼，保證通過，同時保證自己的package代碼不錯。

Publishing

現在我們的package沒問題了，也測試通過了，剩下的就是發布了，要注意一些小的細節，要不發布很可能失敗。

Prepare Your Package

package.json 一定要有 name， description 和 repository字段

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

package.json 會有 engines 來表示工作環境，一般就是 {"Atom":">=1.0.0 <2.0.0"}

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

整個文件要在github上有自己的地址，并且已經提交

Publish Your Package

在你發布之前，最好去atom官網上找找會不會有跟你同名的package，如果有，你就只能修改名字，確保沒有之后，你就可以在你的目錄下使用

apm publish minor

來發布你的package了

這個命令會做以下事情：

注冊一個package的名字在atom.io上，如果是第一次發布

更新version從package.json文件中，然后提交

創建一個新的 git tag 給這次提交

推送這個tag和分支到 github上

用新發布的version更新到 atom.io 上

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

term中顯示成功之后，你就可以在

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

看到你的package的頁面了。記得編寫README.md的內容給大家看。

說說 minor這個意思，其實publish后面跟的參數有三個選項的。

major：表示給 apm 增加版本號的第一個數字，1.0.0 這樣子 git tag 也會是 v1.0.0

minor：第二個數字， 0.1.0的含義

patch：最后一個數字， 0.0.1的意思

這個是跟版本號管理對應的，一般數來 major對應是往后兼容性的改變，例如修改默認設置或者刪除功能， minor 一般就是添加一個小功能或者優化。 patch 就是修復小的bug。

以上就一個完整的atom package開發和發布的過程，主要參考官網的文檔，里面有我一定的心得。

同時，介紹我的新插件 https://atom.io/packages/vue-format

主要是最近開始寫 vue.js，然后webpack打包，使用.vue的文件方式，結果沒有能格式化文件的插件，所以給atom寫了一個，這是 0.1.0的版本，有問題很正常，我后面還會慢慢優化，如果大家有興趣，可以一起來優化，或者給我提各種issue，歡迎交流

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/78234.html

做一個運行Python文件的Atom插件

摘要：由于這個插件有式的程序返回值和運行時間的顯示，我希望我的插件也具有這個功能。這個命令在后臺其實會做很多事情，比如設置中的版本號添加版本標簽并提交到版本庫中。可以看到第一次提交插件的版本號為。最近在學習Python，自然也安裝了Atom編輯器的一些Python插件。有一個插件名字叫做atom-python-run，作用很簡單，就是按F5運行當前Python文件。不過這個插件有一個問題，...

Genng 2019-07-25 11:45 評論0 收藏0
如何從0開發一個Atom組件

摘要：將剪切板中的數據轉換為然后暫存到本地，通過本地文件的方式來進行上傳七牛。以上，就是開發一個插件的完整流程咯。最近用Atom寫博客比較多，然后發現一個很嚴重的問題。。沒有一個我想要的上傳圖片的方式，比如某乎上邊就可以直接copy/paste文件，然后進行上傳。然而在Atom上沒有找到類似的插件，最接近的一個，也還是需要手動選擇文件，然后進行上傳。這個操作流程太繁瑣，索性自己寫一個插件用...

lauren_liuling 2019-08-22 16:14 評論0 收藏0
開始開發atom插件（并無系列）

摘要：注意本文目的不在開發一個什么什么插件，只告訴你如何進行開發注下文并無太多代碼，代碼建議到你新建一個模版插件然后你就擁有了所有的代碼，然后根據下文加深自己的理解，相信你會看懂它。開始開發入口文件有個方法釋放資源的方法不要做其他事情。 atom高級用法？？？除了自定義功能基本沒啥好玩，抱著裝逼的想法，搜了一波atom插件入門，發現說得太迷糊（可能是我太菜），然后打開了官網的插件文檔，細細的...

solocoder 2019-08-22 18:49 評論0 收藏0
一文教你構建自己的library、webpack優化和npm版本控制

摘要：地址點個，給我們一點動力中文文檔地址交流地址點個，謝謝這套費了幾個月時間和很多心血，現在已經趨于完善，你完全可以在你的生產環境中試著使用。介紹構建自己的UI庫，你必須要對一款打包工具熟悉(webpack, gulp或者grunt), 本文以webpack為例。 github 地址: https://github.com/reming0227... (點個 star，給我們一點動力 ...

劉玉平 2019-08-26 13:53 評論0 收藏0
【Node Hero】1. 開始使用 Node.js

摘要：使用一個事件驅動的非阻塞式的模型，讓它輕量而高效。也就是說提供了用編寫服務器的可能性，這種服務器具有令人難以置信的性能。正如官方聲明所說是一個使用與瀏覽器相同引擎的運行時。這意味著有兩個發布版本穩定版和試驗版。本文轉載自：眾成翻譯譯者：網絡埋伏紀事鏈接：http://www.zcfy.cc/article/1748原文：https://blog.risingstack.com/nod...

hqman 2019-08-20 18:59 評論0 收藏0