简介
resume-to-html 是一个针对前端开发者的 npm 包,可以将 JSON 格式的简历转换成精美的 HTML 页面,方便展示和分享。它支持自定义主题样式,可以根据自己的需求进行调整。
安装
使用 npm 安装:
npm install -g resume-to-html
使用
1. 编写简历
首先,我们需要编写我们的简历。简历采用 JSON 格式,具体格式可以参考 resume-schema。
-- -------------------- ---- ------- - --------- - ------- ----- ----- -------- ----------------------- -------- ------ ---------- ---------- --------------------- ---------- -- ------- -- ---- -------- ----------- - ---------- ----- -------- ---- ------------- --- ------- ------- ---- ----------- -------------- ----- --------- ------------ -- ----------- - - ---------- ---------- ----------- ------- ------ ------------------------- - - -- ------- - - ---------- ---------- ----------- ------------ ---------- --------------------- ------------ ------------- ---------- ------------- ---------- ----------------- ------------- - -------- --- --------- ----- --- -------- - - - -
2. 转换成 HTML
将 JSON 格式的简历转换成 HTML 格式:
resume-to-html resume.json -t themes/eloquent
其中,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
参数指定自定义主题即可:
resume-to-html resume.json -t themes/my_theme
示例代码
以下是一个简单的示例代码:
-- -------------------- ---- ------- - --------- - ------- ----- ----- -------- ----------------------- -------- ------ ---------- ---------- --------------------- ---------- -- ------- -- ---- -------- ----------- - ---------- ----- -------- ---- ------------- --- ------- ------- ---- ----------- -------------- ----- --------- ------------ -- ----------- - - ---------- ---------- ----------- ------- ------ ------------------------- - - -- ------- - - ---------- ---------- ----------- ------------ ---------- --------------------- ------------ ------------- ---------- ------------- ---------- ----------------- ------------- - -------- --- --------- ----- --- -------- - - - -
resume-to-html resume.json -t themes/eloquent
-- -------------------- ---- ------- ------- ---- --------------- ---- --------------- --------------------- ---------------------------------- ------------------ --------------------- ---------------------------- ---------------- ---------------- ------------------ ----- - ---- - - ------- ---- ----- - ------ -------- - ---------- ----- - ------------ ------- ----------- - ------------ ----- - - ----- ------ ---- ------ ---------------------- -- ------------ -------------------------- -- -------------- ----------------------- ------- --------------- ---------------- ----------------- ------------------ ------------------- ---- --- -- --------------- ------- --------------- -------------------- - --------------------- ------------ ---- --------- -- -------------- -- ------------ ---------------- ----------------- ---- ------- -- ----------------- ------- ---------------- ------------------------ - ------------------------- ---------------- ---- --------- -- ------------------ -- ------------ ----------------- ------------------ ---- ----------- -- ---------------------- ------- ------------------------ ------------------------------- - ----------------------------- -------------------- -- -------------------------- ------------------ ----------------------------------------- -------------- --------------- ---- ----- -- ------------- ------------- -- ---- ----- -- ------------ ------------- -- ----------- ---------------- -------------------------- ----------------- --------------- ---------------- - ------------ ------------------ - ------------ ----------------------------------------------- - ------------ ----------------------- --------------- ----- ------- --------------------------------------------------------- --------------------------------------------------------------------- ------ - ---------------------------- - - ---------- - --------- ----- - ------- ------------------ - --- - --- ----- -------
-- -------------------- ---- ------- ------- - ------- ---- -- -- - ---------- ----- ------- ---- -- ------------ ------- - -- - -------- -- ------- -- -- - ------- --- -- -------- ----- ------------ ------- ------------- - ------------ ----- ----------- -------- -------------- ---- ------- ---- ------ ----- --------- - ------- ----- -------------- ---- ----------- ------------------ ------ -------- --------- - - - - -
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/5eedb3ebb5cbfe1ea06111e7