一統江湖的大前端（4）shell.js——穿上馬甲我照樣認識你

《一統江湖的大前端》系列是本身的前端學習筆記，旨在介紹javascript在非網頁開發領域的應用案例和發現各種好玩的js庫，不按期更新。若是你對前端的理解仍是寫寫頁面綁綁事件，那你真的是有點OUT了，前端能作的事情已經太多了, 手機app開發 , 桌面應用開發 , 用於神經網絡人工智能的庫 , 頁面遊戲 , 數據可視化 , 甚至 嵌入式開發 ，什麼火就搞什麼,活脫脫一個蹭熱點小能手。若是你也以爲前端的平常開發有些枯燥，不妨一塊兒來看看前端的另外一番模樣。

前端開發人員的工做內容幾乎不多會涉及腳本的編寫，建議將shell.js和git的命令行指令綜合在一塊兒做爲專題學習，集中學習一下經常使用指令。更詳細的參數請參考專門的shell腳本語言資料進行學習。

一.Shell && Shelljs

碼農界存在着無數條鄙視鏈，linux使用者對windows的鄙視即是其中之一，cli使用者對GUI用戶的嘲諷也是如此，在這樣一個講究逼格的時代，若是你的桌面上沒有一個小黑窗時不時地從下往上翻滾並拋出一些亮綠色的字符串，你真很差意思跟人打招呼。而前端這種天生幾乎不用和命令行打交道的物種，天然再一次莫名其妙地處在了鄙視鏈的末端，沒錯，是再一次。

Shell是linux下的腳本語言解析器，擁有豐富且強大的底層操做權限。Shelljs就是基於node的一層命令封裝插件，讓前端開發者能夠不依賴linux也不依賴相似於cmder的轉換工具，而是直接在咱們最熟悉不過的javascript代碼中編寫shell命令實現功能。

二.前端開發人員學Shelljs幹嗎

shell跟自動化是強相關的，我的理解其用途主要是兩方面：

• 1.從業務邏輯的需求來看，shelljs並非什麼具備非凡意義的插件，它只是對node的底層API進行了一些封裝，方便咱們以相似shell的語法去編寫代碼梳理邏輯，實現一些業務邏輯需求，若是你所在的項目組剛好須要這樣的能力，用它會很方便;
• 2.cli相對於GUI或許是更快，但它依然是一種重複勞做，有了shelljs和全棧能力，開發者能夠將團隊中耗時的重複性常規動做編寫爲自動化腳本，並利用前端的自然優點爲其配備GUI，用頁面上的一鍵點擊來替代重複勞做，在緊張的開發節奏中，平均天天爲你節約個30-40分鐘起來走走喝杯水難道很差嗎？

想要一統江湖，大前端的深度和廣度是缺一不可的，你能夠說你不精通shell，但不要說本身不懂shell，更不要一臉天真地反問面試官「前端還能搞shell？這麼神奇？」他不會以爲你對知識有好奇心，只會以爲你很low，哦不對，是大寫的LOW.

三.官方示例（包含註釋）

廢話說完了，開始學習，拿好小本子，我要開車了。

//引入shelljs
var shell = require('shelljs')

//檢查控制檯是否以運行`git `開頭的命令
if (!shell.which('git')) {
  //在控制檯輸出內容
  shell.echo('Sorry, this script requires git');
  shell.exit(1);
}

shell.rm('-rf','out/Release');//強制遞歸刪除`out/Release目錄`
shell.cp('-R','stuff/','out/Release');//將`stuff/`中全部內容拷貝至`out/Release`目錄

shell.cd('lib');//進入`lib`目錄
//找出全部的擴展名爲js的文件，並遍歷進行操做
shell.ls('*.js').forEach(function (file) {
  /* 這是第一個難點：sed流編輯器,建議專題學習，-i表示直接做用源文件 */
  //將build_version字段替換爲'v0.1.2'
  shell.sed('-i', 'BUILD_VERSION', 'v0.1.2', file);
  //將包含`REMOVE_THIS_LINE`字符串的行刪除
  shell.sed('-i', /^.*REMOVE_THIS_LINE.*$/, '', file);
  //將包含`REPLACE_LINE_WITH_MACRO`字符串的行替換爲`macro.js`中的內容
  shell.sed('-i', /.*REPLACE_LINE_WITH_MACRO.*\n/, shell.cat('macro.js'), file);
});

//返回上一級目錄
shell.cd('..');

//run external tool synchronously
//即同步運行外部工具
if (shell.exec('git commit -am "Auto-commit"').code !== 0){
    shell.echo('Error: Git commit failed');
    shell.exit(1);
}

三.官方示例中涉及的命令解釋：

• shell.which(command)

  在環境變量PATH中尋找指定命令的地址，判斷該命令是否可執行，返回該命令的絕對地址。

• echo

  在控制檯輸出指定內容

• exit(code)

  以退出碼爲code退出當前進程

• rm

  刪除一個目錄中一個或多個文件或目錄，一旦刪除，沒法恢復。 經常使用參數：

  • -f:強制刪除文件;
  • -i:刪除以前先詢問用戶;
  • -r:遞歸處理目錄;
  • -v:顯示處理過程;

• cp([options,] source_array, dest)

  用來將一個或多個源文件或目錄複製到指定的文件或目錄。 經常使用參數:

  • -f:強制刪除文件;
  • -i:刪除以前先詢問用戶;
  • -r:遞歸處理目錄;

• cd

  切換工做目錄至指定的相對路徑或絕對路徑。cd..爲返回上一級，cd-回到前一目錄。

• ls

  用來顯示目標列表。 經常使用參數:

  • -a:顯示全部文件;
  • -C:多列顯示查詢結果;
  • -l:單列長格式顯示查詢結果(與-C相反);
  • -R:遞歸處理目錄;

• sed([options,] search_regex, replacement, file_array

  將file_array中符合search_regex的內容替換爲replacement，支持正則的捕獲組自引用。一次處理一行內容，處理完成後把緩衝區內容送往屏幕，而後處理下一行，循環直至結束。功能豐富且用法較複雜，建議自行百度進行專題學習。

  • -i:直接做用源文件

• cat

  將一個或多個文件內容讀入，指定一個文件時讀入該文件，指定多個文件時將內容鏈接在一塊兒讀入。

• exec(command,[, options][, callback])

  執行所傳入的命令

  • async:是否異步執行,默認false，傳入callback時自動開啓
  • slient:不輸出信息到console,默認false
  • encoding:默認utf8

四.文檔中其餘API概覽

• chmod

  設置文件調用權限

  • 基本語法 ：chmod [-cfvR] [--help] [--version] mode file...
  • -c：若文件權限確實被更改，才顯示更改動做
  • -f: 權限沒法被更改時不顯示錯誤信息
  • -v: 顯示權限變動的詳細資料
  • -R: 遞歸，對其目錄下全部文件和子文件執行相同操做
  • mode字段格式 : [ugoa...][[+-=][rwxX]...][,...]
  • u表示該文件擁有者，g表示同一羣體者，o表示其餘，a表示全部
  • +表示增長權限，-表示取消權限，=表示惟一設定權限
  • r表示可讀，w表示可寫，x表示可執行，X表示當該文件是個子目錄？

• find(path[,path...])

  尋找路徑

• grep([options,] regex_filter,file)

  從指定文件中抓取符合正則的行

  • -v:翻轉正則匹配
  • -l:僅打印符合條件的文件名

• head([{'-n': ,}] file)

  顯示指定文件中的前N行

  • -n :顯示前 <num>行

• mv

  移動文件

• pwd

  返回當前目錄

• rm

  見上文

• set

  設置全局變量的值

• sort

  將文件的內容逐行排序

  • -r:反轉結果
  • -n:依據數值對比

• tail

  讀取指定文件的末尾n行，對比head命令進行理解

• test（）

  評估一個表達式是否爲真(如下僅爲最多見的參數用例)

  • -d,path:若是path是一個路徑則返回true
  • -e,path:若是path存在則返回true

• ShellString()

  構造器，將一個字符串轉化爲Shell字符串,轉化後的字符串支持鏈式調用特殊的shell命令

• ShellString.Prototype.to()

  將shellString輸出至指定文件,至關於腳本語言中的>

• ShellString.Prototype.toEnd()

  將shellString追加至指定文件,至關於腳本語言中的>>

• touch([options,]file)

  生成文件

  • -m：僅修改編輯時間
  • -c：不建立任何文件
  • -d DATE:指定時間
  • -r FILE:用FILE的時間替代新文件時間

• env['VAR_NAME']

  指向process.env

• Pipes鏈式調用支持

  sed,grep,cat,exec,to,toEnd均支持鏈式調用。

個人博客即將入駐「雲棲社區」，誠邀技術同仁一同入駐。