利用Hexo和Gitee搭建一个静态博客

没有服务器也可以哦

用gitee pages与Hexo搭建免费的个人博客

本文主要讲解gitee上搭建, 之后会讲github上的搭建.

1.前期准备

• 有一个gitee账号, 没有就先去注册一个
• 本地安装node.js, 配置教程
• 本地安装git for windows, 可根据系统选择, 本文按照windows讲解.

2.创建gitee仓库开启pages服务

  先创建仓库, 点击右上角的加号; 再进入仓库, 开启pages服务.

这里建议，将你的仓库名设置为你的用户名，例如我的gitee用户名是 CRainyD

ay，就将仓库名设置为：crainyday，这样的话，后边开启的静态网站服务的 url为：https://crainyday.gitee.io，而不是 https://crainyday.gitee.io/仓库名，看着更舒服一点。

注意: !!!每次用hexo d提交代码后, 都需要更新一下pages服务, 然后过几秒再进入你的博客!!!其实不更新也行, 但可能不会出现你预期的效果

3.Hexo的安装与使用

  Hexo是一个很常用的博客发布工具, 支持markdown格式(推荐一款md编译器), hexo有很多插件和主题.

  一定要配置好系统的环境变量, 才能用npm和hexo命令, 若不能用请看配置教程

1
2
3
4
5
6
7
8

#全程在博客目录下进行, 先新建一个空文件夹(例:F:/Hexo), 再cd进入该目录
#安装hexo
npm install hexo-cli -g
npm install hexo-server --save
#用hexo新建项目, 生成站点
hexo init
#清理缓存&&生成项目文件&&本地运行项目
hexo clean && hexo g && hexo s#需要先安装hexo-server插件,才能hexo s

  执行到这里, 如果前面过程中没有错误, 就会在本地成功启用Hexo博客站点, 通过http://localhost:4000访问本地博客站点, 如图:

  执行完hexo init命令, 生成的Hexo的目录结构如图:

  若想要将本地的博客文件push到gitee仓库, 需要先配置_config.yml全局配置文件, 再进行步骤4配置git相关信息, 最后才能执行下列命令将本地博客上传到远程仓库.

1
2
3
4
5
6
7
8
9
10

#发布项目到远程
hexo d#需要hexo-deployer-git插件,配置完一些git的相关配置才能上传
#生成页面
hexo new page "xxx"
#生成新文章
hexo new "xxx"
#安装插件
npm install xxx --save
#卸载插件
npm unstall xxx

  以上命令既可以用Windows的cmd来完成, 也可以用git bash来完成, 但有的命令cmd执行会有一些问题, 建议全部使用git bash来执行. 之后会提到git bash的使用

这里是一些Hexo 主题，你可以选择一个自己喜欢的主题。下载后放在 themes 目录下即可。

有关其他的主题配置，请看各主题的 README 文档。

根目录_config.yml全局配置文件

1
2
3
4
5
6
7
8
9
10
11
12

title: CRainyDay's Blog
author: CRainyDay
language: zh-CN
#url
url: http://crainyday.gitee.io/blog #这里填写gitee pages生成的url
root: /blog #博客根目录
theme: landscape #网站应用的主题名字,可以换为你喜欢的主题
#与hexo d相关的配置
deploy:
  type: git
  repo: https://gitee.com/用户名/仓库名.git #你的gitee仓库地址
  branch: master

注意: 配置文件中每个 : 后要有一个英文的空格

每个主题相应的目录下也有主题的_config.yml配置文件

4.git的使用

1
2
3
4
5
6
7
8
9
10
11

#需要在你的博客根目录下右键运行Git Bash Here
git config --global user.name "你的gitee用户名"
git config --global user.email "你的gitee绑定的邮箱地址"
git init
git remote add origin <你的仓库地址>
#以下命令这里用不到, 可以了解一下
git clone <想要克隆的项目地址>
git pull origin master#拉取代码
git add .
git commit -m "提交信息"
git push origin master#提交代码

5.上传到gitee仓库

在你的本地博客根目录下, 右键运行Git Bash Here, 输入hexo d命令上传, 第一次上传期间需要输入你的gitee账号密码

注意: hexo d命令必须安装hexo-deployer-git插件

上传之后别忘了更新一下pages服务, 其实不更新也可以, 但是有时会出一些错误.

之后访问你开启pages服务时给你的url就可以了, 那便是你的博客地址.