Mac上使用Hexo+Github搭建个人博客

写在开始这篇文章记录了自己在Mac上使用Hexo和Github搭建博客时遇到的一些问题和踩过的坑。希望对你有所帮助。

准备工作
1. git
2. node.js 用来生成静态页面


由于Mac上自带的git,所以只需要我们下载安装node.js就可以node.js网址:

https://nodejs.org/en/


创建一个Hexo 空文件夹备用
1. 安装 Node.js 《一直下一步就ok》
git 和node.js安装好的话就可以进行安装Hexo,在终端下输入:

 $  sudo npm install -g hexo

按enter后需要输入你mac登录密码

2. 初始化

在终端cd到你建立的文件夹名称下,执行:

$ cd 文件路径

然后执行:

$ hexo init
3. 执行安装:
$ hexo install
4. 执行如下命令,开启hexo服务:
$ hexo s
5. 执行生成静态页面:
$ hexo g

以上命令( hexoinit hexo s)安启动成功,在浏览器中访问 http://localhost:4000 如果访问成功说明hexo 安装成功.


关联 Github
1. 首先我们需要获取到 ssh key

可执行一下命令来检查ssh key是否存在:

$ ls -al ~/.ssh

如果有文件 id_rsa.pub 和 id_dsa.pub ,从第2点开始执行

1. 生成 ssh key:
$ ssh-keygen -t rsa -C "你的github注册时邮箱“

按回车出现下图:


.ssh ~ 安装提示

是否创建生成秘钥,选Y ,然后会让输入mac的密码完成后会出现下图:

.ssh ~ 安装成功

可以使用微博作为图床也可以使用七牛云作为图床,这里我使用七牛云作为图床:

http://www.qiniu.com/

2. 打开Github 添加 ssh key到Github

进入Github –> Settings –> SSH Keys –> add SSH Keys

.ssh ~ github设置

key值可以通过终端命令来复制:

  $ pbcopy < ~/.ssh/id_rsa.pub

Title里任意添加一个标题,把复制的内容粘贴到Key里面点击下方Add key绿色按钮即可.

  1. 创建Github库

Github库

创建库名要和你的登录名一样:

name.github.io

  1. 打开Github客户端

这里第一次我使用的是 github 客户端 clone 的代码,当然你可以在终端使用命令行clone

Github客户端

Clone 你在 github 上创建的名称 .github.io 这个库完成后,我们可以进行设置一下 hexo 主题


设置Hexo主题:

$ cd 本地目录

执行下面的命令(下面是一个主题):

  $ git clone https://github.com/iissnan/hexo-theme-next them

具体配置方法可以参照官方文档 http://theme-next.iissnan.com/


绑定域名:

我这里是在阿里云买的域名

阿里云

  1. 打开终端 cd到本地仓库:
$ cd blog
  1. 新建 CNAME 文件,注意不要后缀名:
$ touch CNAME

创建成功后,在文件里写入你的域名比如: chencha.ren

把Hexo文件夹下public文件夹里面的内容复制到你clone下来的文件夹里面(关键一步)如下图:

hexo ~ public

  1. 接下来进行如下操作:

    1. 跟踪新文件把public的文件全部,添加到缓存区如下:

  $ git add CNAME

2. 查看文件状态:

$ git status

3. 提交说明:

  $ git commit -m "内容“

4. 提交代码到服务器:

   $ git push origin master

注意:如果修改了本地文件需要重新部署到Github上执行如下代码:

$ hexo clean
$ hexo d 

然后把puclic里面的文件复制到clone到github文件里,从3开始执行提交代码。

到目前一个简单的 Hexo + Github 博客算是搭建完成,你也可以参考官方文档来搭建自己炫酷的博客。这是我的个人博客 http://chencha.ren 或者查看我的简书: http://www.jianshu.com/p/da5b2a103a18

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值