前言

搭建个人博客一般有两种选择,一个是使用WordPress,但是需要将博客搭建在服务器上,不过搭建好后写文章方便,适合没有程序基础的人使用。另一个是使用Hexo,相对简洁高效,不需要服务器,既可以部署在本地,也可以将博客部署到GitHub Pages上,支持Markdown语法,缺点是需要有Git基础,写文章比WordPress麻烦点。

初次使用Hexo来搭建个人博客,确实比较手忙脚乱,这里记录一下流程,希望对大家能有所帮助。

(注:本文是只针对Windows平台的搭建教程)

可以点击这里查看该Hexo博客Demo的样子;有兴趣的也可以戳下这里看看我的个人博客。

How to play

本教程一共分为3章:

  • 第一章是安装环境和本地搭建
  • 第二章是博客的个性化配置
  • 第三章是将博客部署到 GitHub Pages

请根据自身需要选择章节,以节省时间:

  • 想要自己从零开始搭建个人博客的,可以从第一章开始看起;
  • 懒得自己搭建的,请将本项目clone到本地,本项目是一个全新的Hexo博客Demo,并且已经安装配置好了 NexT 主题。此外,还请:
  • 已在本地搭建好个人博客,想要了解怎么将博客部署到 GitHub Pages 的,可以从第三章看起

另外,由于Hexo及其主题的配置文件都是英文的,所以本项目对部分配置文件添加了中文注释,有兴趣的可以另行拷贝。

1. 安装环境

  • 安装Node.js
  • 安装Git
  • 安装Hexo

1.1 安装Node.js

Hexo是一个基于Node.js的快速、简洁且高效的静态站点生成框架,想要安装Hexo,需要先安装Node.js,官网的安装包有两种,一种是安装程序.msi文件,一种是.zip压缩包,这里选择.msi文件,安装后会自动配置好环境变量。

下载链接

1.2 安装Git

Git就不多说了,作为开发者或多或少都会接触过吧,直接前往官网下载安装包即可。操作教程网上也是一堆,这里就不赘述了。

下载链接

如果Git和Node.js的环境变量都配置好了,可以通过在cmd中确认安装结果。

git --version
node -v

1.3 安装Hexo

安装好Node.js,就可以使用npm来安装Hexo

npm install -g hexo-cli

安装完毕后,可以通过hexo version来确认是否安装成功。

2. 开始搭建个人博客

千里之行,始于足下,在安装好所有的环境之后,我们终于可以开始搭建博客的第一步了。

2.1 初始化Hexo项目

首先是选择一个文件夹,用来给我们我们的个人博客的存放各种文件。接着进入该文件夹的路径,打开cmd命令窗口,这里有两种打开方式:

  1. 按住Shift,同时点击鼠标右键,选择在此处打开命令窗口
  2. 在上方的地址栏里输入cmd,接着回车即可快速打开命令窗口。

当然,你也可以直接Win+R然后输入cmd来打开命令窗口,不过需要再通过cd命令将路径切换到你指定的文件夹。

接着输入指令来初始化你的博客

hexo init

初始化成功后,你会看到

Start blogging with Hexo!

2.2 生成静态页面文件

接下来,执行命令

hexo g

该命令用来生成静态页面文件到public目录,Hexo会将 source 文件夹中除 posts 文件夹之外,以下划线_开头命名的文件或文件夹、以及隐藏的文件将会被忽略。Markdown 和 HTML 文件会被解析并放到 public 文件夹,而其他文件夹会被拷贝过去。

最后,我们只要启动Hexo服务器就行了。

2.3 本地启动Hexo服务器

hexo s --debug

Hexo启动服务器的速度非常快,很快你就可以看到

Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.

恭喜你,你的个人博客已经搭建成功了,接下来只要在浏览器输入http://localhost:4000/就可以在本地访问你的博客了。

这里使用hexo s也可以启动服务器,只不过加上--debug 参数,如果运行中出错可以看到错误信息。

2.4 关闭Hexo服务器

要想关闭服务器,只需要在命令窗口按下Ctrl+C就可以了,这个组合键不仅仅用于关闭服务器,事实上你在cmd窗口中任何执行中的命令都可以用这个组合键来结束命令,只要连按两次该组合键就可以连输入Y或者N都不用。

3. 常用的命令

hexo new "postName"  #新建文章
hexo new page "pageName" # 新建页面
hexo generate # 生成静态页面至public目录
hexo server # 启动服务器(默认端口4000,'ctrl+c'关闭server)
hexo deploy # 项目部署
hexo help # 查看帮助
hexo version # 查看Hexo的版本
hexo clean # 清除Hexo的缓存

上边的一些命令可以使用简写

hexo n
hexo g
hexo d
hexo s

3.1 本地调试三连

hexo clean
hexo g
hexo s --debug

3.2 远程部署三连

hexo clean
hexo g
hexo d

注:在使用部署命令时,需要先用npm安装 hexo-deployer-git 插件:

npm install hexo-deployer-git --save

4. 撰写第一篇博文

Hexo撰写博文也不难,分为 post 和 draft 两种,其中 post 存放在 source/_posts 目录下,draft 存放在 source/_drafts 目录下。

post 和 draft 的区别在于前者会被发布到博客,而后者不会被发布。

4.1 第一篇文章

hexo n post "my-first-post"

Hexo会自动在 source/_posts 目录下新建一个名为 my-first-post 的 .md 文件;打开该文件,可以看到:

---
title: my-first-post
date: 2018-04-21 23:11:30
tags:
---

这是 post 模板自动生成的 YAML 文件头,title 是这篇 post 的标题,可以将其改为 My First Post;date 是创建的日期;tags 是该 post 的标签,可以添加自定义的标签:

---
title: My First Post
date: 2018-04-21 23:11:30
tags:
- demo
- first-post
---

接着再进行本地调试三连,就可以看到刚刚写好的博文了。

hexo clean
hexo g
hexo s --debug

4.1 第一篇草稿

创建命令和前边类似:

hexo n draft "my-first-draft"

另外草稿的头文件是没有日期的:

---
title: my-first-draft
tags:
---

草稿文件是不会被 hexo g 命令生成到public目录下的。

Hexo搭建博客教程(1) - 安装环境与本地搭建的更多相关文章

  1. 手把手教从零开始在GitHub上使用Hexo搭建博客教程(四)-使用Travis自动部署Hexo(2)

    前言 前面一篇文章介绍了Travis自动部署Hexo的常规使用教程,也是个人比较推荐的方法. 前文最后也提到了在Windows系统中可能会有一些小问题,为了在Windows系统中也可以实现使用Trav ...

  2. 手把手教从零开始在GitHub上使用Hexo搭建博客教程(三)-使用Travis自动部署Hexo(1)

    前言 前面两篇文章介绍了在github上使用hexo搭建博客的基本环境和hexo相关参数设置等. 基于目前,博客基本上是可以完美运行了. 但是,有一点是不太好,就是源码同步问题,如果在不同的电脑上写文 ...

  3. 手把手教从零开始在GitHub上使用Hexo搭建博客教程(二)-Hexo参数设置

    前言 前文手把手教从零开始在GitHub上使用Hexo搭建博客教程(一)-附GitHub注册及配置介绍了github注册.git相关设置以及hexo基本操作. 本文主要介绍一下hexo的常用参数设置. ...

  4. 手把手教从零开始在GitHub上使用Hexo搭建博客教程(一)-附GitHub注册及配置

    前言 有朋友问了我关于博客系统搭建相关的问题,由于是做开发相关的工作,我给他推荐的是使用github的gh-pages服务搭建个人博客. 推荐理由: 免费:github提供gh-pages服务是免费的 ...

  5. Hexo+NexT(零):最全Hexo+Next搭建博客教程

    快速.简洁且高效的博客框架 有位大神说,喜欢写博客的人的人,折腾博客会经历三个阶段.找到一个免费空间,搭建一个博客,很欣喜,很有成就感,此为一阶段:受限免费空间各种限制,自己买空间和域名,实现对博客的 ...

  6. GithubPages + Hexo + Disqus博客教程

    文章主要描述了利用github page,hexo静态博客框架以及disqus来搭建个人静态博客的详细步骤. github page用来搭建博客的主页,hexo用来更改博客主题.发布文章等等,并通过配 ...

  7. Hexo搭建博客教程(2) - 博客的简单个性化配置

    本章主要讲博客的个性化,譬如站点的基本配置(语言.头像.站点图标等).安装新的Hexo主题(NexT主题)以及主题的配置. 1. 修改站点配置 打开站点配置文件 ,找到: # Site title: ...

  8. Hexo搭建博客教程(3) - 远程部署到GitHub Pages

    本章讲的是如何将本地的个人项目远程部署到 GitHub Pages,涉及到GitHub的项目仓库.Git的使用,以及Hexo的远程部署等. 1. 安装 hexo-deployer-git 插件 想要将 ...

  9. 转载一遍比较好的,django2.1搭建博客教程

    非常感谢这位博主,找了几个星期终于找到了 https://www.dusaiphoto.com/article/article-detail/4/

随机推荐

  1. SCAU RP Test —— 因式分解与组合

    D  RP Test Time Limit:1000MS  Memory Limit:65535K 题型: 编程题   语言: 无限制 描述 LRC是SCAU_ACM校队的主席,职业生涯为校队作过很多 ...

  2. linux /usr /var /etc 目录

    /usr 目录是应用程序主要存放的目录.该目录中的二进制文件对系统启动和维护并非必要,因此整个 /usr 目录结构常会被存放到另一个分离的文件系统中.因为其(通常)具有很大的容量,/usr 有其自己的 ...

  3. LSH-局部敏感哈希

    LSH的基本思想是: 将原始数据空间中的两个邻近数据点通过某种映射或变换,使得这两个数据点在变换后的数据空间中仍然相邻的概率很大,而不相邻的数据点被映射到同一个桶的概率很小. 因此,最最重要的就变成了 ...

  4. python 二分法例子及冒泡排序

    #!/usr/bin/env python #-*- coding:utf-8 -*- def binary_search(source_data,find_nu): mid = len(source ...

  5. IDEA 设置背景颜色及字号

    intellij IDEA 设置背景颜色   File--> Settings 2. Appearance & Behavior --> Appearance 设置边框背景颜色 3 ...

  6. DBCPTool

    dbcp读取配置文件的方式: 1. 导入3个包:commons-dbcp-...  .jar(数据源) commons-collections-.....jar(集合) commons-pool... ...

  7. JAVA 反射机制 获得 private 变量

    public class Triangle { // 定义三角形的三边 protected long lborderA = 0; protected long lborderB = 0; protec ...

  8. C语言--递归问题

    1,一个经典的例子,理解递归过程的展开 #include<stdio.h> void func(int i){ ) func(i/); printf("%d",i) } ...

  9. 评判云服务靠谱程度 -- Coding 安全那些事

    本文依据孙宇聪在 SegmentFault D-Day 北京场的演讲内容整理,并授权首发于“高效运维”公众号.10月11日,SegmentFault 将在上海举办D-Day,围绕 Docker 主题. ...

  10. c++中IO输入输出流总结<一>

    1 io类图关系 1.1 简化形式 1.1.2补充 iostream: istream:从流中读取 ostream:写入到流 iosteram:读写流 fstream: ifstream:从文件读 o ...