作為程序員，在平時(shí)的開發(fā)中肯定少不了一些命令行操作了。當(dāng)然，簡(jiǎn)單的命令大家都是可以拿捏的，但是涉及到一些邏輯的時(shí)候還是比較頭疼的。

Shell

Shell 是一個(gè)用 C 語(yǔ)言編寫的程序，它是用戶使用 Linux 的橋梁。它既是一種命令語(yǔ)言，又是一種程序設(shè)計(jì)語(yǔ)言。

Shell 腳本（shell script），是一種為 shell 編寫的腳本程序，一般文件后綴為 .sh。

Shell 編程跟 java、php 編程一樣，只要有一個(gè)能編寫代碼的文本編輯器和一個(gè)能解釋執(zhí)行的腳本解釋器就可以了。

Shell 的解釋器種類眾多，常見的有：

• sh? - 即Bourne Shell。sh? 是Unix? 標(biāo)準(zhǔn)默認(rèn)的shell。
• bash? - 即Bourne Again Shell。bash? 是Linux? 標(biāo)準(zhǔn)默認(rèn)的shell。
• fish? - 智能和用戶友好的命令行shell。
• xiki? - 使shell 控制臺(tái)更友好，更強(qiáng)大。
• zsh - 功能強(qiáng)大的 shell 與腳本語(yǔ)言。

一般在 shell 腳本的開頭，#! 告訴系統(tǒng)其后路徑所指定的程序即是解釋此腳本文件的 Shell 解釋器。#! 被稱作 shebang。

所以，你應(yīng)該會(huì)在 shell 中，見到諸如以下的注釋：

指定 sh 解釋器：

#!/bin/sh

指定 bash 解釋器：

#!/bin/bash

zx

當(dāng)然，無(wú)論哪種解釋器，對(duì)前端程序員都不算友好，有一定的學(xué)習(xí)成本。

畢竟我們只是 “切圖仔”。

開個(gè)玩笑，因?yàn)槲覀兦岸顺绦騿T的口號(hào)是：能用 JS 實(shí)現(xiàn)的絕對(duì)不用其他語(yǔ)言實(shí)現(xiàn)。

當(dāng)然，我們也可以用 Node.js 執(zhí)行一些簡(jiǎn)單的 Shell 命令：

const { execSync } = require("child_process");

exec('git diff orgin/master', (err, data) => {
  if (err) {
    console.log("失敗", err);
    process.exit(1);
  } else {
    console.log("成功", data);
  }
});

但是這個(gè)體驗(yàn)和直接寫 Shell 腳本相比就比較差了，我們需要手動(dòng)用 child_process 進(jìn)行包裝、每次引入一些額外的依賴庫(kù)、異常處理也比較麻煩、另外還要考慮轉(zhuǎn)譯命令行參數(shù)。

所以 Google 的前端程序員開源了基于 JavaScript 實(shí)現(xiàn)的 Shell 解釋器。zx 對(duì) child_process 進(jìn)行了默認(rèn)包裝，對(duì)參數(shù)進(jìn)行了轉(zhuǎn)譯而且提供了合理的默認(rèn)值?？梢院芊奖愕淖屛覀兪褂们岸耸煜さ?nbsp;JavaScript 語(yǔ)法來(lái)編寫 Shell 腳本：

#!/usr/bin/env zx

await $`cat package.json | grep name`

let branch = await $`git branch --show-current`
await $`dep deploy --branch=${branch}`

await Promise.all([
  $`sleep 1; echo 1`,
  $`sleep 2; echo 2`,
  $`sleep 3; echo 3`,
])

let name = 'foo bar'
await $`mkdir /tmp/${name}`

使用

安裝（要求 Node.js 版本 >= 16.0.0）：

npm i -g zx

建議將腳本寫到 .mjs 的文件里，這樣我們可以很方便的直接在頂層使用 await，然后在文件開頭聲明下面的 shebang：

#!/usr/bin/env zx

通過(guò)下面的方式運(yùn)行腳本：

chmod +x ./script.mjs
./script.mjs

或者使用 zx 運(yùn)行：

zx ./script.mjs

可以嘗試一下：

const list = await $`ls -a`;

console.log(list);

const name = await question('你的名字是啥? ')

console.log(`你的名字是：${name}`);

所有函數(shù)（$、cd、fetch等）都可以直接使用，無(wú)需任何導(dǎo)入。

它還內(nèi)置了很多方便的處理函數(shù)：

• $command?：使用child_process? 的spawn? 來(lái)制定指定的命令，返回一個(gè)Promise
• cd()?：進(jìn)入其他目錄。（cd('/project')）
• fetch()：發(fā)起方洛請(qǐng)求
• question()?：讀取用戶輸入，相當(dāng)于readline 的封裝
• sleep()?：等待一段時(shí)間，相當(dāng)于setTimeout 的封裝
• echo()?：大打印文本，也可以直接用console.log

更多使用可以參考官方文檔：https://github.com/google/zx。