【博客搭建】Hexo 使用笔记

Hexo 是一款前端博客框架,可以自动根据基于 Markdown 的文章生成博客网站代码。

基本概念

项目结构

目录 描述
_config.yml 网站的配置信息
themes 主题文件夹
scaffolds 模板文件夹
scripts 脚本文件夹
source 资源文件夹
source/_drafts 草稿文件夹
source/_posts 发布文件夹

资源存储

source 文件夹

用户资源都放在 “source” 文件夹,发布时该文件夹中的 markdown 和 html 都会被自动解析并放到 public 文件夹,而其他文件则会被拷贝过去。

“source” 文件夹中除了“_post” 文件夹,默认情况下其他所有带“_”前缀的文件或文件夹都会被忽略。

文章存放

文章一般存放在“source/_drafts”和“source/_posts”文件夹,两者分别对应文章的两种状态:草稿和发布。

存储为草稿状态的文章默认是不在网站显示的,可通过修改网站配置“render_drafts”更改。

只要将 md 文件放入这些文件夹即可被 Hexo 识别到。

文章布局

布局即是创建文章所用的模板文件,其统一存放在 scaffolds 文件夹,可用_config.yml 文件中 default_layout 参数指定默认布局。

Hexo 支持三种默认布局,用其创建的文章会自动存放到不同的文件夹,如果是自定义布局则和 post 相同。

布局 路径
page source
draft source/_drafts
post source/_posts
自定义布局 source/_posts

编写布局文件时还可以利用 Hexo 的变量功能,使创建文章时自动编写 Front-matter,变量需要用两个大括号括起。

变量 描述
layout 布局
title 标题
date 文件建立日期

Front-matter

Front-matter 是每个文章开头处用“---”或“;;;”分割的区域,两者分别对应着“YAML”和“JSON”两种写法,它用于指定当前文章的属性信息,Hexo 中部分功能的运行依赖其中的信息。

常用的一些文章属性如下。

参数 描述
title 标题
categories 分类
date 建立时间
published 是否发布
layout 布局(主题可能识别该项从而影响页面效果)
updated 更新时间
comments 开启评论

常用命令

使用命令前需要全局安装 hexo-cli,这样才能使用 hexo 命令。

npm install hexo-cli -g

项目

hexo init [folder] # 创建一个博客网站
hexo {g|generate} # 编译网站静态资源(很多pages服务自带构建功能,所以该命令一般不用)
hexo clean # 清除项目的缓存文件

后台

hexo config [key] [value] # 查看或修改网站配置
hexo list <type> # 列出网站数据
hexo server [--draft] # 启动本地服务器以预览网站[包括草稿文章]
hexo {d|deploy} # 将网站部署到托管平台

写作

hexo new [layout] <title> # 新建一篇文章
hexo publish <filename> #发布一篇文章

【博客搭建】Hexo使用笔记的更多相关文章

  1. [原创]HEXO博客搭建日记

    博客系统折腾了好久,使用过Wordpress,Ghost,Typecho,其中Typecho是我使用起来最舒心的一种,Markdown编辑+轻量化设计,功能不多不少刚好,着实让我这种强迫症患者舒服了好 ...

  2. 基于Github&Hexo的个人博客搭建过程

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  3. Hexo博客搭建以及Next主题美化的经验之谈

    这并不是一篇博客搭建教程.内容主要包含个人对于Hexo博客搭建的心得,Next6.0主题美化的部分建议,以及摘录一些各种用于博客搭建的link. 在博客园3年6个月,确实也学到了很多,博客园也是目前为 ...

  4. 搭建个人博客 github+hexo

    其实相关的教程网上有很多很多,不过就是很多很多,而且技术大神们每个人都写得不一样啊喂,为什么我明明就是一步一步按照教程来的还是有那么多乱七八糟的错?...所以我决定写此篇记录一下我搭建博客的过程以及我 ...

  5. Hexo博客搭建全解

    [原创,转载请附网址:http://dongshuyan.top] 欢迎来到莫与的博客,第一篇记录了一下怎么写一篇博客,以方便之后写博客~ #从配置说起下载安装Git与Node.js略过 1.安装he ...

  6. U盘便携式hexo&博客搭建&极速纯净低bug主题推荐&部署到coding&SEO优化搜索

    指南:U盘便携式hexo&博客搭建&极速纯净低bug主题推荐&部署到coding&SEO优化搜索   U盘便携式hexo随处写博客 简述:在任意一台联网的电脑上续写he ...

  7. w10环境下Hexo博客搭建

    w10使用hexo+github手把手搭建自己的第一个博客 对一个程序员来说,博客的重要性不言而喻,不但可以积累知识,还可以更好的给别人分享自己的心得.今天就以时下比较流行的hexo博客搭建属于自己的 ...

  8. 【基础篇】hexo博客搭建教程

    [基础篇]搭建hexo博客(一) 作者:Huanhao bilibili:Mrhuanhao 前言 你是否想拥有属于自己的博客?你是否无奈与自己不会写网站而烦恼? 不要担心,本系列教程将会实现你白嫖的 ...

  9. 【简单版】hexo博客搭建流程梳理

    前言 本文章会为你梳理一个搭建hexo博客的流程 相关网址: Docs: https://hexo.io/docs/ Themes: https://hexo.io/themes/ 安装hexo 准备 ...

  10. Hexo结合Stun静态博客搭建从入门到入土

    摘要 安装npm,安装hexo相关依赖,安装主题stun 修改hexo配置,修改stun配置,部署到github,gitee实现静态访问 给博客加上全局搜索,访问量统计 hexo博客编写模板 tips ...

随机推荐

  1. windows下fopen,fclose断电数据丢失解决办法

    #include <io.h> //在fclose之前调用fflush和_commit,可以有效防止断电数据丢失 fflush(file); _commit(fileno(file)); ...

  2. Docker跨主机跨服务器迁移

    ​主要作用: 就是让配置好的容器,可以得到复用,后面用到得的时候就不需要重新配置. 其中涉及到的命令有: docker commit 将容器保存为镜像 docker save -o 将镜像备份为tar ...

  3. jQuery 国内 CDN

    eShop 中使用了 cdnjs ,由于网络问题,导致编译失败 可以使用如下国内链接: https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.mi ...

  4. GraphQL Part II: 中间件

    GraphQL Part II: 中间件 如果您熟悉 ASP.NET Core 的中间件,您可能注意到在我们上一篇博客中我们已经拥有了一个中间件.在初始的空白应用中,中间件的职责是返回 hello W ...

  5. 使用 JDK19 虚拟线程实现5百万持久连接

    使用Project Loom 虚拟线程实现5M 持久连接| 黑客新闻 记得十几年前 erlang 火的时候,单机 20万连接.100万连接不停刷新,后来 golang 也开始炫耀,抛开连结构化错误处理 ...

  6. 浅聊web前端性能测试

    最近正好在做web前端的性能测试,这次就来聊聊关于这个的测试思路~ 首先从用户的思维去思考,关于web前端性能,用户最看重的是什么...... 其实就是下面三个点: 1. 加载性能(即页面加载时间+资 ...

  7. 【微软】微软程序注册(zfile自建API)

    Zfile支持设置自己的回调地址,怎么设置呢? 参考:https://docs.zfile.vip/advanced/onedrive-api/ 上面文档写的很清楚了,我提醒两点 1.进入 https ...

  8. 【MyBatis】学习笔记11:解决字段名和属性的映射关系

    [Mybatis]学习笔记01:连接数据库,实现增删改 [Mybatis]学习笔记02:实现简单的查 [MyBatis]学习笔记03:配置文件进一步解读(非常重要) [MyBatis]学习笔记04:配 ...

  9. 使用 Visual Studio Code 进行调试

    现在是时候实践你新获得的调试知识了. 我们刚好有一个完美的机会. 在我们的 Tailwind Traders 应用中,我们正在开发一项新功能:允许以多种货币显示产品的价格. 一位同事为这一目的编写了一 ...

  10. [转]C# SerialPort串口通信发送接收,处理接收数据完整

    废话少说,直接上干货.感兴趣的读者自己去研究代码吧.请见谅. using System; using System.Collections.Generic; using System.IO.Ports ...