npm 包 resume-to-html 使用教程

阅读时长 10 分钟读完

简介

resume-to-html 是一个针对前端开发者的 npm 包,可以将 JSON 格式的简历转换成精美的 HTML 页面,方便展示和分享。它支持自定义主题样式,可以根据自己的需求进行调整。

安装

使用 npm 安装:

使用

1. 编写简历

首先,我们需要编写我们的简历。简历采用 JSON 格式,具体格式可以参考 resume-schema

-- -------------------- ---- -------
-
  --------- -
    ------- ----- -----
    -------- -----------------------
    -------- ------ ----------
    ---------- ---------------------
    ---------- -- ------- -- ---- --------
    ----------- -
      ---------- ----- -------- ----
      ------------- --- -------
      ------- ---- -----------
      -------------- -----
      --------- ------------
    --
    ----------- -
      -
        ---------- ----------
        ----------- -------
        ------ -------------------------
      -
    -
  --
  ------- -
    -
      ---------- ----------
      ----------- ------------
      ---------- ---------------------
      ------------ -------------
      ---------- -------------
      ---------- -----------------
      ------------- -
        -------- --- ---------
        ----- --- --------
      -
    -
  -
-

2. 转换成 HTML

将 JSON 格式的简历转换成 HTML 格式:

其中,resume.json 是我们编写好的简历,themes/eloquent 是自定义主题样式。

3. 查看生成的 HTML

生成的 HTML 文件位于 out/index.html,我们可以打开它查看转换后的效果。

自定义主题

resume-to-html 内置了一些主题样式,我们也可以自定义主题样式。主题样式位于 themes 目录,我们可以在这个目录下新建一个文件夹,然后添加样式文件。

添加样式文件

在新建的文件夹下添加两个文件:

  • index.jade:Jade 模板,用来渲染 HTML 结构。
  • main.scss:Sass 样式表,用来设置样式。

Jade 模板可以参考已有的模板,Sass 样式表可以参考 themes/basic 目录下的样式表。

使用自定义主题

在使用 resume-to-html 命令时,使用 -t 参数指定自定义主题即可:

示例代码

以下是一个简单的示例代码:

-- -------------------- ---- -------
-
  --------- -
    ------- ----- -----
    -------- -----------------------
    -------- ------ ----------
    ---------- ---------------------
    ---------- -- ------- -- ---- --------
    ----------- -
      ---------- ----- -------- ----
      ------------- --- -------
      ------- ---- -----------
      -------------- -----
      --------- ------------
    --
    ----------- -
      -
        ---------- ----------
        ----------- -------
        ------ -------------------------
      -
    -
  --
  ------- -
    -
      ---------- ----------
      ----------- ------------
      ---------- ---------------------
      ------------ -------------
      ---------- -------------
      ---------- -----------------
      ------------- -
        -------- --- ---------
        ----- --- --------
      -
    -
  -
-
-- -------------------- ---- -------
------- ----
---------------
  ----
    ---------------
    ---------------------
    ---------------------------------- ------------------
    --------------------- ---------------------------- ---------------- ---------------- ------------------

    -----
      -  ---- -
      -    ------- ---- -----
      -    ------ --------
      -    ---------- -----
      -    ------------ ------- -----------
      -    ------------ -----
      -  -
    ----- ------

  ----
    ------
      ----------------------
      -- ------------
        --------------------------
      -- --------------
        ----------------------- -------

    ---------------
      ----------------
      -----------------

    ------------------
      -------------------
      ---- --- -- ---------------
        -------
          ---------------
          --------------------
          - --------------------- ------------
          ---- --------- -- --------------
            --
              ------------

    ----------------
      -----------------
      ---- ------- -- -----------------
        -------
          ----------------
          ------------------------
          - ------------------------- ----------------
          ---- --------- -- ------------------
            --
              ------------

    -----------------
      ------------------
      ---- ----------- -- ----------------------
        -------
          ------------------------
          -------------------------------
          - ----------------------------- --------------------
          -- --------------------------
            ------------------
            -----------------------------------------

    --------------
      ---------------
      ---- ----- -- -------------
        -------------
        --
          ---- ----- -- ------------
            ------------- -- -----------
              ----------------
                -------------------------- -----------------

    ---------------
      ----------------
      -
        ------------
        ------------------
      -
        ------------
        -----------------------------------------------
      -
        ------------
        ----------------------- ---------------

    ----- -------
    ---------------------------------------------------------
    ---------------------------------------------------------------------
    ------
      - ---------------------------- -
      -   ----------
      -     --------- -----
      -     ------- ------------------
      -   ---
      - ---
    ----- -------
-- -------------------- ---- -------
------- -
  ------- ---- --

  -- -
    ---------- -----
    ------- ---- --
    ------------ -------
  -

  -- -
    -------- --
    ------- --

    -- -
      ------- --- --
      -------- -----
      ------------ -------

      ------------- -
        ------------ -----
        ----------- --------
        -------------- ----
        ------- ----
        ------ -----

        --------- -
          ------- -----
          -------------- ----
          ----------- ------------------ ------ -------- ---------
        -
      -
    -
  -
-

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/5eedb3ebb5cbfe1ea06111e7

纠错
反馈