&web_id=" language="JavaScript">
Fork me on GitHub

Hexo博客搭建攻略(一):基础篇

简介

相信程序猿们都有开博客的想法,因为一个博客完美的集分享代码、记录笔记和展示自己等功能为一身。今天就自己搭建的博客给大家分享一下如何搭建基于hexo + GitHub的博客。

搭建的准备

Hexo基于Node.js环境,Node.js是一个Javascript运行环境。如果想搭建基于hexo的博客,首先要安装Node.js。

安装

Windows平台请到node官网下载安装包进行安装。

Hexo

安装好Node.js环境后,就可以通过node来安装Hexo。
首先我们在自己的工作目录下,新建一个blog目录,在此目录上我们可以管理自己的博客源代码,进入blog目录,执行以下指令:

1
$ cnpm install -g hexo //安装Hexo
1
$ hexo init //初始化Hexo
1
$ cnpm install //安装依赖包
1
$ hexo g //生成静态页面
1
$ hexo s //生成本地预览

打开浏览器,输入 http://localhost:4000/ ,看到以下界面说明Hexo安装成功。

部署环境

目前的一切都只能在本机预览,既然是博客,就需要上传到网络上让人们访问。当然你可以选择购买服务器来搭建自己的博客,但是本教程是教给大家如何免费的使用GitHub进行博客搭建。所以,我们需要登录GitHub官网进行注册,并实现我们的搭建。

创建仓库

首先登录我们的GitHub,在右上角的加号处新建我们的仓库。

如下图,填写仓库名称,千万要注意仓库名称的格式,一定要以“你的GitHub账号.github.io”命名,这个仓库就是你以后访问你博客站点的默认域名。

创建成功后,接下来就需要配置SSH-key。

部署公匙

Hexo部署时,采用git协议,为避免暴露账户密码,最好使用证书认证,所以我们需要在Github部署公钥。

进入账号的Personal setting页面,选择SSH and GPG keys,进入密钥配置页面。填入本机公钥,点击Add SSH key,如下图

输入以下指令,测试密钥连接

1
ssh -T git@github.com

如果返回Hi yourname! You've successfully authenticated, but GitHub does not provide shell access.则说明公钥部署成功。特别提醒,请注意保护本机私钥的安全。

如果本机还没有SSH密钥,请点击下方详细链接,这里就不做介绍了。

步骤请点击 window下配置SSH连接GitHub、GitHub配置ssh key

将blog部署到 GitHub pages 上

配置deploy

找到blog目录下的配置文件_config.yml【为了方便辨析,下文统一称之为站点配置文件】,用编辑器打开此文件,找到此文件中的deploy字段,按照以下配置:

1
2
3
4
deploy:
type: git
repository: git@github.com:yourname/yourname.github.io.git
branch: master

注意:将yourname改成你自己的GitHub名字!

设置git身份信息

1
2
git config --global user.name "你的用户名"
git config --global user.email "你的邮箱"

然后执行以下指令

1
cnpm install hexo-deployer-git --save

执行以下指令进行部署

1
2
hexo g
hexo d

浏览器打开 https://yourname.github.io 就可以看到刚才本地预览页面,做到这里,恭喜你已经成功将自己的博客传到网站上了。

域名配置

尽管到这里你已经可以通过 https://yourname.github.io 来访问自己的博客,但是我想大家也会觉得这种名字很土,想不想加上自己喜欢的域名,特别是.com等解析度很高的域名呢?

先去买一个域名,什么后缀的都可以,在这里博主推荐购买腾讯云的域名,最近腾讯云有云+校园计划,可以每月花1元钱租一台云服务器,还可以领25块钱的域名优惠券,点击这里哦!腾讯云+校园计划

进域名控制台,在解析里面添加一条CNAME记录,指向yourname.github.io.即可【注意,最后有个点】,具体请看如图配置。

到blog/source目录下创建CNAME文件,添加你要绑定的域名保存。

然后执行部署

1
2
hexo g
hexo d

不出意外,这时用自己的域名就可以访问自己的博客站点,如果出错,极可能是DNS数据还没更新,请稍等一段时间再试,DNS数据同步更新一般不会超过48小时。

Hexo 基本操作

1
2
3
4
5
6
7
hexo new"postName" #新建文章
hexo new page"pageName" #新建页面
hexo generate #生成静态页面至public目录
hexo server #开启预览访问端口(默认端口4000,'ctrl + c'关闭server)
hexo deploy #将.deploy目录部署到指定空间
hexo help # 查看帮助
hexo version #查看Hexo的版本

通过这些操作你就能通过git bush来上传你博客的内容了,是不是很简单呢?
接下来我还会推出有关next主题的配置和美化的博客,谢谢大家。

部分资料参考 carry学姐的布置篇,也是我的启蒙篇,感谢学姐!

Godlike Meteor wechat
欢迎您扫一扫上面的微信公众号,订阅我的博客!
我知道不会有人点开,但万一真有人想不开呢?
------ 本文结束 ------