就在昨天，Ali Churcher分享了使用CSS網(wǎng)格佈局製作簡(jiǎn)歷的整潔方法。讓我們通過(guò)創(chuàng)建一個(gè)模板來(lái)構(gòu)建一點(diǎn)，每當(dāng)我們想要使用命令行時(shí)，我們可以旋轉(zhuǎn)。很酷的事情是，您只需一個(gè)命令就可以運(yùn)行它。

我知道命令行可能令人生畏，是的，我們將在node.js中工作。我們將使事情分為小步驟，以使其更容易跟隨。

像許多項(xiàng)目一樣，涉及一些設(shè)置。首先在工作目錄中創(chuàng)建一個(gè)空文件夾，然後使用NPM或紗線初始化項(xiàng)目。

 mkdir your-project && cd“ $ _”

## npm
npm init

##紗
紗線初始化

無(wú)論您使用什麼名稱(chēng)“您的項(xiàng)目”，都將是NPM註冊(cè)表中包裝的名稱(chēng)。

下一步是為應(yīng)用程序創(chuàng)建一個(gè)輸入文件，即在這種情況下為index.js。我們還需要一個(gè)存儲(chǔ)數(shù)據(jù)的地方，因此創(chuàng)建另一個(gè)名為data.json的文件。創(chuàng)建命令行後，您可以從命令行打開(kāi)它們：

觸摸index.js &&觸摸data.json

創(chuàng)建命令行接口

我們從創(chuàng)建此應(yīng)用程序中獲得的最大好處是，它為我們提供了一種直接在命令行中創(chuàng)建簡(jiǎn)歷的半維持方式。我們需要幾件事才能實(shí)現(xiàn)：

• 存儲(chǔ)數(shù)據(jù)的對(duì)象
• 交互式命令行界面（我們將使用詢(xún)問(wèn)器構(gòu)建）

讓我們從第一個(gè)開(kāi)始。破解打開(kāi)數(shù)據(jù)。 json並添加以下內(nèi)容：

 {
  “教育”： [
    “一些信息”，
    “不太重要的信息”，
    “等等，等等?！?  ]，，
  “經(jīng)驗(yàn)”： [
    “一些信息”，
    “不太重要的信息”，
    “等等，等等?！?  ]，，
  “接觸”： [
    “一種與您聯(lián)繫的方式”
  這是給出的
}

這只是定義將用於接口中每個(gè)步驟的對(duì)象和鍵的示例。您可以完全修改它以滿足自己的需求。

那是我們需要的第一件事。第二件事是交互式界面。詢(xún)問(wèn)者。 JS將處理90％的內(nèi)容。請(qǐng)隨時(shí)閱讀有關(guān)此軟件包的更多信息，因?yàn)槟梢栽诟煜に腎ns和Outs時(shí)構(gòu)建更高級(jí)的界面。

紗線添加詢(xún)問(wèn)者粉筆

那粉筆是什麼？這是一個(gè)庫(kù)，可以通過(guò)添加一些顏色和樣式來(lái)幫助我們自定義終端輸出。

現(xiàn)在，讓我們打開(kāi)index.js並粘貼以下代碼：

 ＃！ /usr/bin/env節(jié)點(diǎn)

“使用嚴(yán)格”；

const詢(xún)問(wèn)者= requir（“詢(xún)問(wèn)者”）;
const粉筆= require（“粉筆”）;
const data = require（“ ./ data.json”）;

//添加響應(yīng)顏色
const響應(yīng)= chalk.bold.blue;

const remumeoptions = {
  類(lèi)型：“列表”，
  名稱(chēng)：“簡(jiǎn)歷”，
  消息：“你想知道什麼”，
  選擇：[... object.keys（數(shù)據(jù)），“退出”]
};

功能showresume（）{
  console.log（“你好，這是我的簡(jiǎn)歷”）;
  處理程序（）;
}

功能處理程序（）{
  詢(xún)問(wèn)器。 prompt（簡(jiǎn)歷）。然後
    if（answer.resumeOptions ==“退出”）返回；

    const options = data [$ {wonse.resumeoptions}`]
    if（options）{
      console.log（響應(yīng)（new詢(xún)問(wèn)者.separator（）））;
      options.foreach（info => {
        console.log（響應(yīng)（“ | =>” info））;
      }）;
      console.log（響應(yīng)（new詢(xún)問(wèn)者.separator（）））;
    }

    詢(xún)問(wèn)者
      。迅速的（{
        類(lèi)型：“列表”，
        名稱(chēng)：“ exitback”，
        消息：“回去還是退出？”，
        選擇：[“ Back”，“ Exit”]
      }）。然後（選擇=> {
        if（choice.exitback ==“ back”）{
          處理程序（）;
        } 別的 {
          返回;
        }
      }）;
  }）。捕獲（err => console.log（'oop，'，err））
}

showresume（）;

zoikes！那是一大堆代碼。讓我們將其撕下來(lái)解釋發(fā)生了什麼。

在文件的頂部，我們正在導(dǎo)入運(yùn)行應(yīng)用程序並使用粉筆庫(kù)設(shè)置顏色樣式所需的所有必要物品。如果您對(duì)顏色和自定義更感興趣，請(qǐng)查看粉筆文檔，因?yàn)槟梢詫?duì)事物具有很高的創(chuàng)意。

 const詢(xún)問(wèn)者= requir（“詢(xún)問(wèn)者”）;
const粉筆= require（“粉筆”）;
const data = require（“ ./ data.json”）;

//添加響應(yīng)顏色
const響應(yīng)= chalk.bold.blue;

代碼要做的下一步就是創(chuàng)建我們的簡(jiǎn)歷選項(xiàng)列表。這些是在我們?cè)诮K端中鍵入命令後將顯示的內(nèi)容。我們稱(chēng)其為簡(jiǎn)歷，因此我們確切地知道它的作用。

 const remumeoptions = {
  類(lèi)型：“列表”，
  名稱(chēng)：“簡(jiǎn)歷”，
  消息：“你想知道什麼”，
  選擇：[... object.keys（數(shù)據(jù)），“退出”]
};

我們對(duì)選擇字段非常感興趣，因?yàn)樗梢詮臄?shù)據(jù)對(duì)像中構(gòu)成鍵，同時(shí)為我們提供一種方法來(lái)“退出”該應(yīng)用程序。

之後，我們創(chuàng)建函數(shù)showresume（），這將是我們?cè)趩?dòng)後立即運(yùn)行的主要功能。它顯示了一些歡迎消息，並運(yùn)行我們的處理程序（）函數(shù)。

功能showresume（）{
  console.log（“你好，這是我的簡(jiǎn)歷”）;
  處理程序（）;
}

好的，現(xiàn)在，大個(gè)子：handleresume（）函數(shù)。第一部分是有條件的檢查，以確保我們尚未退出該應(yīng)用程序，並在所有情況下都從我們的數(shù)據(jù)對(duì)像中顯示註冊(cè)選項(xiàng)。換句話說(shuō)，如果選擇的選項(xiàng)已退出，我們將退出程序。否則，我們將獲取根據(jù)所選密鑰可用的選項(xiàng)列表。

因此，一旦應(yīng)用程序確認(rèn)我們沒(méi)有退出，我們就會(huì)得到答案。解決方案，正如您可能已經(jīng)猜到的那樣，吐出了我們?cè)赿ata.json文件中定義的部分列表。我們定義的是教育，經(jīng)驗(yàn)和聯(lián)繫。

這將我們帶到了詢(xún)問(wèn)者。如果我們列出這些作品，這可能是最簡(jiǎn)單的：

您是否注意到選項(xiàng)輸出中的new詢(xún)問(wèn)器.separator（）函數(shù)？這是詢(xún)問(wèn)器的功能，它在內(nèi)容之間提供了視覺(jué)分離器，以使內(nèi)容稍微分解一點(diǎn)並使界面更易於閱讀。

好吧，我們正在顯示選項(xiàng)列表！現(xiàn)在，我們需要讓AA返回上一個(gè)屏幕。為此，我們創(chuàng)建了另一個(gè)詢(xún)問(wèn)者。在其中我們將通過(guò)一個(gè)新對(duì)象，但是這次只有兩個(gè)選項(xiàng)：退出和返回。它將通過(guò)我們需要處理的答案向我們返回承諾。如果選擇的選項(xiàng)會(huì)返回，我們運(yùn)行處理程序（）意味著我們?cè)俅问褂眠x項(xiàng)打開(kāi)主屏幕；如果我們選擇退出，我們將退出功能。

最後，我們將添加捕獲語(yǔ)句以捕獲任何可能的錯(cuò)誤。好練習(xí)。 :)

發(fā)布給NPM

恭喜！嘗試運(yùn)行Node index.js，您應(yīng)該能夠測(cè)試該應(yīng)用程序。

那太好了，一切都很棒，但是要使它運(yùn)行不必每次都直接工作。這比我們剛剛看過(guò)的功能要簡(jiǎn)單得多。

1. 如果您沒(méi)有一個(gè)帳戶，請(qǐng)?jiān)贜PMJS.com上註冊(cè)一個(gè)帳戶。
2. 通過(guò)運(yùn)行NPM助推器將用戶添加到CLI中。
3. 提供您用於註冊(cè)NPM帳戶的用戶名和密碼。
4. 轉(zhuǎn)到package.json並添加以下行：

    “垃圾桶”： {
     “您的包裝名稱(chēng)”：“ ./index.js”
   }

5. 添加將顯示在應(yīng)用程序NPM頁(yè)面上的readme.md文件。
6. 發(fā)佈軟件包。

 NPM發(fā)布 -  access = public

每當(dāng)您更新軟件包時(shí)，都可以將其推向NPM。在此處閱讀有關(guān)NPM版本的更多信息。

 NPM版本補(bǔ)丁// 1.0.1
NPM版本未成年人// 1.1.0
NPM版本專(zhuān)業(yè)// 2.0.0

並將更新推向NPM：

 NPM發(fā)布

恢復(fù)魔術(shù)！

就是這樣！現(xiàn)在，您可以體驗(yàn)到在命令行中鍵入NPX您的包裝名稱(chēng)並在此處創(chuàng)建簡(jiǎn)歷的魔力。順便說(shuō)一句，NPX是運(yùn)行命令而無(wú)需將其安裝到計(jì)算機(jī)的方式。如果您安裝了NPM，則可以自動(dòng)適合您。

這只是一個(gè)簡(jiǎn)單的終端應(yīng)用程序，但是了解場(chǎng)景背後的邏輯將使您創(chuàng)造出驚人的事物，這是您邁向它的第一步。

原始碼

愉快的編碼！

以上是如何在NPM上構(gòu)建簡(jiǎn)歷的詳細(xì)內(nèi)容。更多資訊請(qǐng)關(guān)注PHP中文網(wǎng)其他相關(guān)文章！