聊聊 npm ABC

參考文章: https://docs.npmjs.com/getting-started/using-a-package.json
安裝 npm (sudo apt-get install npm ,它是 Node Package Mmagement的縮寫),主要是用來管理套件的工具.

(A) npm init,  package.json

若要自訂功能可以將文件寫在 package.json 裡面, package.json 內容是用 json (Javascript Object Notation的縮寫)的語法來描述,它是成對的 key:value 加上逗號後,全部再用大括號框起來,其中key必須是用雙引號括起來的字串, value 除了可以用雙引號括起來的字串外,若有多個項目時,也可以用另一個json的語法來描述.一個最簡單的package.json內容,裡面必須要有"name"及"version"這兩個key的描述,其他可以選擇性的加入,另外key敘述的順序並不重要,當用 npm init 執行時,它會用問答的方式一個一個填入package.json裡面:

// package.json
   {
     // 常用的 key 有:
    "name": "目前的專案名稱"
    "version": "版本編號,通常使用像是 1.0.0 這種3個數字的方式來編碼",
    "description": "簡單的敘述",
    "main": "主程式檔案名稱",
    "scripts":
          {  // 可以執行的命令列, 例如
            "test": "js --version"
            "go": "js main.js"
          },
    "keywords": "關鍵詞",
    "author": "作者姓名",
    "license": "版權宣告",
    "bugs": "待解問題",
    "homepage": "官網網址",
    "dependencies": "依賴相關套件",
    "devDependencies": "依賴開發中的相關套件"
    "repository":
         { //該專案的寄存位置
            "type": "git",
            "url":  "https://github.com/username/package"
         }
  }

每次初始一個專案都要一個個輸入填寫,會覺得煩死人,可以利用nodejs對物件的語法將它匯出來( 檔案路徑及名稱是 ~/.npm-init.js ),需要注意跟json語法不同的是 ~/.npm-init.js 實際上是一個javascript,會經 nodejs執行過,因此對於物件的key並不需特別用雙引號括起來.示範用工具 vi 來編輯檔案 ~/.npm-init.js:

        vi   ~/.npm-init.js

//檔案內容
  module.exports = {
       name: 'hello',
       version: '1.0.0',
  }

將它存檔之後,只要一道命令:
    npm init -y
正常來講,會在當前目錄底下生成package.json檔案,內容就是上述檔案匯出的預設值,同時也不會出現惱人的問答,當然直接編輯package.json也是可以的.

(B) npm install, dependencies, devDependencies
如果在package.json有描述dependencies,那麼指令 npm install 就會自動安裝缺少的相關套件,一般並不需要特別去填寫這個項目,如果要自行安裝單獨套件只要下命令:
   npm install 套件名稱

如果npm install後面再添加 --save 那該套件名稱的相關性,自然會寫進package.json的 dependencies 物件裡面,如果npm install後面再添加 --save-dev 那該套件名稱的相關性就會自動寫入package.json的 devDependencies 物件裡面,示範安裝套件 uglifyjs, javascript-obfuscator, js-beautify, browserify:

   npm install   --save-dev   uglify-js@github:mishoo/UglifyJS2#harmony
   npm install   --save-dev   javascript-obfuscator
   npm install   --save   js-beautify
   npm install   --save   browserify

當完成安裝後再打開檔案package.json,可以看到在dependencies及devDependencies處,會自動加入上述套件名稱,而套件所提供的命令,通常放在 ./node_modules/套件名稱/bin 或是./node_modules/套件名稱/js/bin目錄下,用 ls 指令來找找看:

   ls -al node_modules/uglify-js/bin/uglifyjs
   ls -al node_modules/javascript-obfuscator/bin/javascript-obfuscator.js
   ls -al node_modules/js-beautify/js/bin/js-beautify.js
   ls -al node_modules/browserify/bin/cmd.js

(C) npm run, scripts
有了命令檔的存放位置後,就可自行定義由 javascript 所寫的命令,把它加在package.json的scripts物件定義裡面:
"scripts:": {
   "uglify": "js node_modules/uglify-js/bin/uglifyjs"
   "encode": "js node_modules/javascript-obfuscator/bin/javascript-obfuscator.js"
   "beauty": "js node_modules/js-beautify/js/bin/js-beautify.js"
   "browse": "js node_modules/browserify/bin/cmd.js"
   }
存檔完,用 'npm  run  自訂命令  主參數  --  其它參數' 來執行,不用輸入一長串的指令,例如:
   npm run uglify my.js
   npm run encode my.js --  -o my_obfus.js
   npm run beauty  my.js
   npm run browse my.js
當然上述簡化的動作用 linux 指令 ln -sf 也可以做到, 只是產生的連結檔,恐影響到整個專案的目錄結構,看起來雜亂無章,將它寫在 package.json裡,列出檔案時就乾淨多了.使用者也只要根據這個 package.json 就可以下載到該專案所需要的資源,省事方便多了.