目录
  1. 新建文章
    1. 使用命令行新建草稿
    2. 新建md文件放到/source/_posts文件夹或其子文件夹中
    3. 具体文章页面的头部属性设置
  2. 新建草稿
  3. 发布、预览和部署
  4. 给文章添加二维码
    1. 使用格式
    2. 范例
    3. 效果
  5. 给文章插入图片
    1. 从剪贴板上传图像
    2. 从资源管理器上传图像
    3. 从输入框上传图像
    4. 使用网络图片
  6. 给文章加密
    1. 快速使用
    2. 高级设置
  7. 给文章插入音频
  8. 给文章添加日历
  9. 在文章中插入优酷视频
  10. 给文章添加流程图
  11. 给文章添加UML数据建模图
使用Visual Studio Code进行Hexo博客写作

欢迎使用 Hexo,本文档将帮助您快速上手。Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。

新建文章

使用命令行新建草稿

hexo new -p "子文件夹/文件标题" "文件标题"

新建md文件放到/source/_posts文件夹或其子文件夹中

具体文章页面的头部属性设置

设置 描述 默认值
title 文章的标题
date 创建日期 文件的创建日期
updated 修改日期 文件的修改日期
comments 是否开启评论 true
description 文章节選 自动节选
cover 封面显示的圖片地址
password 加密文章的加密密码
tags 标签
categories 分类

新建草稿

hexo new draft "草稿标题"

发布、预览和部署

# 清除缓存: 
hexo clean

# 生成静态网页:
hexo g # 简写
hexo generate

# 预览:
hexo s # 简写
hexo server

# 部署:
hexo d # 简写
hexo deploy

给文章添加二维码

使用格式

{% qrcode data [alt:text] [title:text] [class] %}

范例

{% qrcode "hello, world" alt:"hello, world" title:"hello, world" %}

效果

hello, world

给文章插入图片

从剪贴板上传图像

Windows / Unix:Ctrl + Alt + u
OsX:Cmd + Opt + u

从资源管理器上传图像

Windows / Unix:Ctrl + Alt + e
OsX:Cmd + Opt + e

从输入框上传图像

Windows / Unix:Ctrl + Alt + o
OsX:Cmd + Opt + 0

使用网络图片

![图片alt](图片地址 ''图片title'')

给文章加密

你可能需要写一些私密的博客, 通过密码验证的方式让人不能随意浏览.

快速使用

将 “password” 字段添加到您文章信息头就像这样.

---
title: Hello World
date: 2016-03-30 21:18:02
password: mikemessi
---

高级设置

---
title: Hello World
tags:
- 作为日记加密
date: 2016-03-30 21:12:21
password: mikemessi
abstract: 有东西被加密了, 请输入密码查看.
message: 您好, 这里需要密码.
wrong_pass_message: 谢谢, 这个密码是正确的, 请点击确定后观看正文.
wrong_hash_message: 抱歉, 这个文章不能被校验, 不过您还是能看看解密后的内容.
---

给文章插入音频

MetingJS 是基于Meting API 的 APlayer 衍生播放器,引入 MetingJS 后,播放器将支持对于 QQ音乐、网易云音乐、虾米、酷狗、百度等平台的音乐播放。

<!-- 简单示例 (id, server, type)  -->
{% meting "60198" "netease" "song" "autoplay" %}

<!-- 进阶示例 -->
{% meting "60198" "netease" "playlist" "autoplay" "mutex:false" "listmaxheight:340px" "preload:none" "theme:#ad7a86"%}

有关

的选项列表如下

选项 默认值 描述
id 必须值 歌曲 id / 播放列表 id / 相册 id / 搜索关键字
server 必须值 音乐平台: netease, tencent, kugou, xiami, baidu
type 必须值 song, playlist, album, search, artist
fixed false 开启固定模式
mini false 开启迷你模式
loop all 列表循环模式:all, one,none
order list 列表播放模式: list, random
volume 0.7 播放器音量
lrctype 0 歌词格式类型
listfolded false 指定音乐播放列表是否折叠
storagename metingjs LocalStorage 中存储播放器设定的键名
autoplay true 自动播放,移动端浏览器暂时不支持此功能
mutex true 该选项开启时,如果同页面有其他 aplayer 播放,该播放器会暂停
listmaxheight 340px 播放列表的最大长度
preload auto 音乐文件预载入模式,可选项: none, metadata, auto
theme #ad7a86 播放器风格色彩设置

给文章添加日历

<% dateLunar(date(post.date)) %>

在文章中插入优酷视频

如要插入优酷视频“同理心”,查看它的链接为http://v.youku.com/v_show/id_XMTQ2MjU2NTU2OA==.html,那么就将其中的id提取出来,使用下述代码即可:

{% youku 400 480 %}
XNDQ0NDgyODgzMg
{% endyouku %}

其中,参数600指定视频展示的高度为600px,800则指定视频展示的宽度为800px,如不写明这两项参数则默认值为高度600px,宽度800px。

给文章添加流程图

  • 示例
` ` `flow
st=>start: 开始
op=>operation: My Operation
cond=>condition: Yes or No?
e=>end
st->op->cond
cond(yes)->e
cond(no)->op
` ` `
  • 效果

给文章添加UML数据建模图

  • 示例
` ` `sequence
Alice->Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!
` ` `
  • 效果
Alice->Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!
```<script src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.2.7/raphael.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/flowchart/1.6.5/flowchart.min.js"></script>
文章作者: Gadfly
文章链接: https://blog.gadfly.pub/2019/12/07/gong-ju-zi-liao/shi-yong-vscode-jin-xing-hexo-bo-ke-xie-zuo/
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 牛虻的世界
打赏
  • 微信
  • 支付寶

评论