fbpx

如何發佈你的「包」到 NPM Repository

npm-logo每一種程式語言都有受歡迎的套件管理系統,PHP 有 Composer, Ruby 有 Gem, NodeJS 的套件管理就是 npm 囉。由於 npm 管理 JavaScript 很方便,漸漸開始很多非正統的 JavaScript Library 也開始推薦使用 npm 管理套件函式庫或是外掛,像是很受歡迎的 jQuery 就是一個例子,已經開始使用 npm 管理 Plugin。npm 本身需要 node.js 套件,可以透過 apt install 直接安裝,大部分的系統都有封裝好的套件直接裝,這裡就不介紹了。

發佈自己的套件到 NPM

一般來說 NPM 適合發佈 JavaScript 所編寫的程式套件,想發佈套件到 NPM Repository 之前,要先註冊一個 NPM 帳號,註冊帳號先填寫以下表單 Sign Up

npm-sign-up

接著先在本地 Clone 一份你想要打包上傳的 GitHub Project (不用 GitHub 當然也可以),然後先透過以下命令新增剛剛註冊的使用者,執行後要輸入帳號與密碼 (資訊會存在 ~/.npmrc 這個檔案中),如下:

npm adduser

接著在你的 Git 目錄中初始化一個新的 package.json,直接如入以下命令:

npm init

建立過程中會先詢問並要求填入一些資訊,最先填入 name 這個欄位是套件名稱,不可以與其它套件重複。繼續填入 version, description, entry point (透過 nodejs 引用套件時需要載入的 JavaScript File), test command, keywords, author, license 等等基本資訊欄位,完成後會自動在目錄下產生 package.json 檔案。執行過程畫面如下:

npm-adduser-init

套件定義檔 package.json

每個套件管理系統都會有定義檔,由一支或多支檔案所組成,主要用來提供套件資訊與套件之間的相依關係,npm 使用 package.json 來定義套件資訊,如同副檔名意指 package.json 是一個以 JSON 格式建立而成的文件,除了上述的幾個基本欄位之外,詳細的定義與使用方法可以參考官方文件。package.json 大致上長得下這樣 (GitHub):

{
  "name": "SnsShare",
  "version": "1.0.0",
  "description": "Social Networking Services Shere jQuery Plugin.",
  "main": "jquery.snsShare.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "https://github.com/samejack/SnsShare"
  },
  "keywords": [
    "jquery",
    "faceboo",
    "google+",
    "twitter"
  ],
  "author": "SJ",
  "license": "Apache 2.0",
  "bugs": {
    "url": "https://github.com/samejack/SnsShare/issues"
  },
  "homepage": "https://github.com/samejack/SnsShare"
}

NPM Publish

上述的 package.json 都準備好之後,只要直接在 package.json 目錄中,執行以下命令就可以發佈了,超簡單 der。

npm publish

執行畫面如下,執行後會自動上傳:

npm-publish

上傳發布完成後,可以登入你的 npm 頁面,就可以看到剛剛發佈的套件了,如下:

npm-repository

未來只要想要安裝,只需要執行 npm install <YOUR_PACKAGE_NAME> 就可以安裝 (上述 Demo 的套件很廢,千萬不要浪費空間安裝哩),如果要更新版本只要修改 package.json 版本號,重新執行 npm publish 即可,是不是很方便呢?發佈完成後記得推 Code 哩,如果透過持續整合系統進行建置與發佈,這樣會更好喔,下次再介紹.......