如何在 npm 上构建简历

就在昨天，Ali Churcher 分享了一种巧妙的方法，可以使用 CSS Grid 布局制作简历。让我们通过创建一个模板来进一步构建它，这个模板可以在我们想要的时候使用命令行启动。这样做的妙处在于，您只需使用一个命令就可以运行它。

我知道命令行可能令人生畏，而且确实，我们将要在 Node.js 中进行一些操作。我们将把事情分解成小的步骤，以方便您理解。

像许多项目一样，需要进行一些设置。首先，在您的工作目录中创建一个空文件夹，并使用 npm 或 Yarn 初始化一个项目。

mkdir your-project && cd "$_"

## npm
npm init

## Yarn
yarn init

您为“your-project”使用的任何名称都将成为您在 npm 注册表中的软件包名称。

下一步是为应用程序创建一个入口文件，在本例中为 index.js。我们还需要一个地方来存储数据，因此创建一个名为 data.json 的另一个文件。创建这些文件后，您可以从命令行打开它们。

touch index.js && touch data.json

创建命令行界面

创建此应用程序带来的最大好处是，它为我们提供了一种半视觉的方式，可以直接在命令行中创建简历。我们需要几件事才能实现这一点。

• 用于存储数据的对象
• 一个交互式命令行界面（我们将使用 Inquirer.js 构建）

让我们从第一个开始。打开 data.json 并添加以下内容

{
  "Education": [
    "Some info",
    "Less important info",
    "Etc, etc."
  ],
  "Experience": [
    "Some info",
    "Less important info",
    "Etc, etc."
  ],
  "Contact": [
    "A way to contact you"
  ]
}

这只是一个示例，它定义了将在界面中每个步骤使用的对象和键。您可以完全根据自己的需要修改它。

这是我们需要的第一个东西。第二个是交互式界面。 Inquirer.js 将处理 90% 的工作。您可以随意阅读有关此软件包的更多信息，因为随着您对它的来龙去脉越来越熟悉，您可以构建更高级的界面。

yarn add inquirer chalk

什么是 chalk？它是一个库，它将帮助我们通过添加一些颜色和样式来定制终端输出，从而获得更好的体验。

现在让我们打开 index.js 并粘贴以下代码

#!/usr/bin/env node

"use strict";

const inquirer = require("inquirer");
const chalk = require("chalk");
const data = require("./data.json");

// add response color
const response = chalk.bold.blue;

const resumeOptions = {
  type: "list",
  name: "resumeOptions",
  message: "What do you want to know",
  choices: [...Object.keys(data), "Exit"]
};

function showResume() {
  console.log("Hello, this is my resume");
  handleResume();
}

function handleResume() {
  inquirer.prompt(resumeOptions).then(answer => {
    if (answer.resumeOptions == "Exit") return;

    const options = data[`${answer.resumeOptions}`]
    if (options) {
      console.log(response(new inquirer.Separator()));
      options.forEach(info => {
        console.log(response("|   => " + info));
      });
      console.log(response(new inquirer.Separator()));
    }

    inquirer
      .prompt({
        type: "list",
        name: "exitBack",
        message: "Go back or Exit?",
        choices: ["Back", "Exit"]
      }).then(choice => {
        if (choice.exitBack == "Back") {
          handleResume();
        } else {
          return;
        }
      });
  }).catch(err => console.log('Ooops,', err))
}

showResume();

天哪！这是一大块代码。让我们把它分解一下，解释一下发生了什么。

在文件顶部，我们正在导入运行应用程序所需的所有必要内容，并使用 chalk 库设置颜色样式。如果您对颜色和自定义感兴趣，请查看 chalk 文档，因为您可以在这些方面发挥创意。

const inquirer = require("inquirer");
const chalk = require("chalk");
const data = require("./data.json");

// add response color
const response = chalk.bold.blue;

接下来代码要做的是创建我们的简历选项列表。这些选项将在我们在终端中键入命令后显示。我们将其称为 resumeOptions，以便我们确切地知道它的作用。

const resumeOptions = {
  type: "list",
  name: "resumeOptions",
  message: "What do you want to know",
  choices: [...Object.keys(data), "Exit"]
};

我们主要关注 choices 字段，因为它构成了我们 data 对象的键，同时为我们提供了一种在需要时“退出”应用程序的方法。

之后，我们创建函数 showResume()，它将成为我们的主函数，在启动后立即运行。它显示了一种欢迎消息，并运行我们的 handleResume() 函数。

function showResume() {
  console.log("Hello, this is my resume");
  handleResume();
}

好的，现在到了最重要的部分：handleResume() 函数。第一部分是一个条件检查，用于确保我们没有退出应用程序，并在一切顺利的情况下显示数据对象中注册的选项。换句话说，如果选择的选项是 Exit，我们将退出程序。否则，我们将获取在所选键下可用的选项列表。

因此，一旦应用程序确认我们没有退出，我们将获得 answer.resumeOptions，正如您可能已经猜到的那样，它会输出我们在 data.json 文件中定义的节段列表。我们定义的节段是教育、经验和联系。

这将我们带到了 Inquirer.js 的内容。如果我们列出这些部分，可能更容易理解

您是否注意到选项输出中的 new inquirer.Separator() 函数？这是 Inquirer.js 的一项功能，它可以在内容之间提供视觉分隔符，以便将内容稍微分开，使界面更易于阅读。

好的，我们正在显示选项列表！现在我们需要提供一种返回上一屏幕的方法。为此，我们创建另一个 inquirer.prompt，在这个 inquirer.prompt 中，我们将传递一个新对象，但这次只有两个选项：退出和返回。它将返回我们需要处理的带有答案的承诺。如果选择的选项是 Back，我们将运行 handleResume()，这意味着我们将再次打开带有选项的主屏幕；如果我们选择 Exit，我们将退出该函数。

最后，我们将添加 catch 语句来捕获任何可能的错误。良好的做法。:)

发布到 npm

恭喜！尝试运行 node index.js，您应该能够测试该应用程序。

这很好，但是如果每次不必在工作目录中运行它，会更好。这比我们刚刚看到的函数要简单得多。

1. 如果您没有帐户，请在 npmjs.com 上注册一个帐户。
2. 通过运行 npm adduser 将用户添加到您的 CLI。
3. 提供用于注册 npm 帐户的用户名和密码。
4. 转到 package.json 并添加以下行

   "bin": {
     "your-package-name": "./index.js"
   }

5. 添加一个 README.md 文件，该文件将在应用程序的 npm 页面上显示。
6. 发布软件包。

npm publish --access=public

每当您更新软件包时，您都可以将这些更新推送到 npm。阅读有关 npm 版本控制的更多信息。

npm version patch // 1.0.1
npm version minor // 1.1.0
npm version major // 2.0.0

以及将更新推送到 npm 的方法

npm publish

简历魔法！

就是这样！现在，您可以体验在命令行中键入 npx your-package-name 并直接创建简历的魔法。顺便说一下，npx 是运行命令而不将其安装到本地机器上的方法。如果您安装了 npm，它会自动为您提供。

这只是一个简单的终端应用程序，但是了解幕后的逻辑将使您能够创建令人惊叹的东西，而这是您通往成功的第一步。

源代码

祝您编码愉快！