HEXO博客搭建指南

1 环境部署操作

1.1 安装Node.js

  1. 进入官网点击下载，进入传送门

hexo博客搭建指南1

  1. 检查

打开cmd或者powershell,输入:

1
2
node -v
npm -v

显示版本号，即安装无误

1.2 安装Git

  1. 进入官网点击下载，进入传送门

hexo博客搭建指南2

  1. 检查

打开cmd或者powershell,输入:

1
git -v

显示版本号，即安装无误

1.3 注册Github账号

  1. Github官网https://github.com,注册账号

  2. 新建项目

hexo博客搭建指南3

项目名字为你的昵称.github.io，例如：

1
2
//我的昵称是free-9
所以我的项目名称为free-9.github.io

hexo博客搭建指南4

  1. 代码库设置

创建好之后，保存code内的SSH，即：

hexo博客搭建指南5

点击右侧的Settings

hexo博客搭建指南6

向下找到Gihub pages点击Launch automatic page generator，Github将会自动替你创建出一个pages的页面。 如果配置没有问题，大约几分钟之后，yourname.github.io这个网址就可以正常访问了

1.4 安装Hexo

  1. 在你放置博客的位置，如E:/hexo，安装hexo-cli输入：
1
npm install hexo-cli -g

再安装hexo

1
npm install hexo --save

安装完成后，检查

1
hexo -v

hexo博客搭建指南7

  1. 初始化一个文件夹：
1
2
3
hexo init 文件夹名称
cd 文件夹名称
npm install
  1. 生成Hexo页面：
1
hexo g
  1. 启动服务：
1
hexo s

默认是localhost:4000，打开浏览器输入即可

1.5 推送到Github

  1. 配置个人信息
1
2
git config --global user.name "你的github用户名"
git config --global user.email "github绑定的邮箱"
  1. 生成密钥
1
ssh-keygen -t rsa -C "github绑定的邮箱"
  1. 查看id_rsa.pub文件，并整个复制
1
cat ~/.ssh/id_rsa.pub
  1. 然后再在Github中添加ssh key

hexo博客搭建指南8

  1. 修改hexo根目录下的文件_config.yml中的deploy，添加之前保存的ssh：
1
2
3
4
5
deploy:
  type: git
  repository: 
	github: git@github.com:Justlovesmile/Justlovesmile.github.io.git
  branch: master
  1. 上传到github：

安装hexo-deployer-git:

1
npm install hexo-deployer-git --save
  1. 查看blog,https://username.github.io

2 Hexo基础

2.1 写博客

  1. 新建文章
1
hexo new '我的第一篇博客'
  1. hexo自动生成一个md文件，修改md内容
    头部如：
1
2
3
4
5
6
7
---
title: postName #文章页面上的显示名称
date: 2020-03-10 12:30:16 #文章生成时间，一般不改，当然也可以任意修改
categories: 默认分类 #分类
tags: [tag1,tag2,tag3] #文章标签，可空，多标签请用格式，注意冒号:后面有个空格
description: 摘要
---
  1. 在头部下面即可写文章内容

markdown，支持html和其自带的语法。Markdown是一种可以使用普通文本编辑器编写的标记语言，通过简单的标记语法，它可以使普通文本内容具有一定的格式。

2.2 新建页面

1
hexo new page "music"

会在source文件夹中生成music文件夹，其内的index.md为页面内容

2.3 常用基本命令

1
2
3
4
5
6
7
8
9
10
hexo new "文章"
hexo new post "文章"
hexo new page "页面"

hexo clean #清除缓存，每次重新部署时最好执行
hexo g #生成静态页面
hexo s #本地端口，默认4000运行
hexo s -p 5000 # 端口5000
hexo d #部署
hexo deploy #部署
1
2
#为了方便，每次准备推送时,可以👇
hexo cl && hexo g && hexo d

详细的hexo操作，请看hexo官方文档

3 主题配置

就拿我的主题来给大家上手吧！

进入传送门，了解主题配置教程吧！

4 Hexo进阶

4.1 推荐编辑器

方便后续魔改内容

  1. VSCode https://code.visualstudio.com/
  2. Sublime Text http://www.sublimetext.com/