快速利用Hexo+GitHub搭建个人博客

310 阅读3分钟

安装前提

Hexo 是基于 Node.js 的博客框架,所以在安装 Hexo 之前,你要确保已经做好了以下准备:

  1. 安装了 Node.js
  2. 安装了Git
  3. 注册了GitHub账号

如果以上这些你还没有完成,可以参考以下步骤:

安装Node.js

  • Node.js 的官网下载相应版本
  • 下载之后,点击安装,一路next就行了
  • 验证是否安装成功 win + R 键,输入cmd进入命令提示符,然后分别输入 node -vnpm -v 命令,如果出现对应版本号,说明Node.js 已经安装成功

安装Git

  • Git官网下载相应版本

  • 下载之后,点击安装,一路next就行了

  • 安装完之后,打开所有程序,如果看到以下程序,说明安装成功

  • 配置git的环境变量

在桌面上右键单击 我的电脑-->属性-->高级系统配置-->环境变量-->系统变量,找到 path这个变量,然后选中,点击编辑-->新建,找到git的安装目录,把bin和 git-core两个目录添加进去,保存。

注册GitHub账号

进入GitHub官网,点击sign in注册即可。

这些准备工作做好之后,接下来就可以正式搭建自己的博客了。

第一步:安装Hexo框架

打开命令行终端(cmd),输入以下命令:

npm install -g hexo-cli

安装完成后,验证是否安装成功:

hexo -v

如果出现以上信息,说明hexo已经安装成功。

第二步:创建博客目录

在你自己喜欢的盘符和目录下创建一个任意名称的文件夹,用来以后存放博客。例如,我的博客目录就是 D:\personal\blog

温馨提示:搭建博客过程中,可能会遇到各种各样的问题和出错,没事,不要灰心,大不了删除这个blog文件夹,重新再来!

第三步:初始化博客

从命令提示符通过 cd 命令进入你创建博客的根目录。例如,我的还是D:\personal\blog目录。

然后输入以下命令:

hexo init

如果出现以下信息,说明博客初始化成功。

提示:如果出现以下错误提示:git 不是内部命令,说明git的环境变量没有配置或者没有配成功,按照安装前提中的步骤,配置以下就OK了。

博客初始化成功后,会在blog的根目录下生成以下文件和目录:

第四步:启动Hexo

在hexo(blog)的根目录下输入以下命令:

hexo s

hexo s 命令中的 s 就是 server的缩写,输入之后,会提示访问博客的地址和端口号,按照提示即可访问本地的博客。

要是想退出,按 Ctrl + C键即可。

第五步:将博客部署到GitHub

  • 在GitHub上新建一个特殊的仓库

这里说的特殊仓库是指,这个仓库的名字必须是 XXX.github.io ,其中XXX是你的GitHub的名字。

因为,在GitHub中只有这一个仓库可以直接访问静态资源,可以当作静态资源的服务器使用。

例如,我的这个仓库如下:

  • 安装 Git 部署的插件

博客的根目录下运行以下命令:

npm install --save hexo-deployer-git

安装成功之后,会出现以下界面:

  • 修改博客根目录下的配置文件

找到博客根目录(站点目录)下的_config.yml文件,找到deploy:这个配置,配置以下几项内容:

  • 配置完成之后,就可以部署到GitHub

以下是常用的命令:

hexo clean

清空本地缓存

hexo g

生成本地静态文件

hexo s

启动本地博客服务器

hexo d

部署到GitHub

结语

到此为止,一个基本的基于hexo和GitHub的博客框架就搭建成功了。如果你对博客的主题样式不是很满意,可以自行搜索,按照个人的喜好,搭配出个性十足的博客网站。希望这篇博客能够帮助到你,未来的路上我们一起进步!