最新 MAC 上基于 Github + Hexo 博客搭建教程

折腾了大半天的时间终于搭建好了自己的博客。在网上随便一搜就有一大堆搭建博客的教程,那为什么还要再写一遍呢。原因如下:

  • 网上绝大多数教程是基于 Windows 系统搭建的博客,在苹果系统上搭建博客的教程不多。
  • 记录搭建博客过程中踩过的坑,帮助更多的小伙伴。

言归正传,接下来进入博客的搭建过程。

1. Node.js 下载和安装

下载地址:Node.js 下载地址

2. Git 的下载和安装

下载地址:Git 下载地址

3. Hexo 安装(重点)

  • 打开苹果电脑终端

  • 输入安装命令

    $ sudo npm install -g hexo-cli

  • 输入检验是否安装成功命令

    $ hexo -v

    若安装成功,会出现如下信息:

  • 在 Mac 的 User 目录下新建文件夹,取名 Hexo

  • 输入下面的命令,进入到 Hexo 目录下

    $ cd Hexo/

  • 输入下面命令,随后会在 Hexo 文件夹下简历网站所需要的所有文件

    $ hexo init

  • 现在,一个本地博客已经搭建成功,可以分别输入以下命令进行验证:

    $ hexo g –生成

    $ hexo s –启动服务本地预览

    服务开启成功后到浏览器中输入 localhost:4000,这时候一个博客便映入眼帘。通过在终端输入Ctrl + C 可以停止本地预览

4. Github Pages 设置

该部分可参考博客 珞璃之神-基于Hexo-Github—搭建个人博客笔记 的第三部分「github Pages设置」

5. 更换博客主题

在第 2 部分预览的时候,默认加载的主题是「landscape」。不过个人感觉「next」主题似乎更好看。

自个体会下。

具体更换主题步骤如下:

  • 复制主题,在终端输入以下命令

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

  • 配置 Hexo 目录下的 config.yml 配置文件中的 theme 属性,将其设置为 next

  • 启用 next 主题

    $ cd themes/next –在终端上从 Hexo 根目录进入你复制的主题目录

    $ git pull

    $ hexo clean –清除默认的缓存主题

    $ hexo g –生成

    $ hexo s –启动本地预览

  • 到浏览器中输入 localhost:4000 查看 next 主题是否更换成功

至此,基于Github + Hexo 的博客也已经搭建成功!

6. 一键发布博客

接下来,教大家一键部署博客到 Github 的方法。

此部分完全参考博客 smartbeng-最适合新手的 GitHub + Hexo 「大话」博客搭建教程 ,内容如下:

  1. 进入 Hexo 的根目录 接着操作以下命令

    $ cd Hexo

    注意 1:现在我们需要clone我们自己的GitHub仓库了

    注意 3:切记下面是你自己的仓库名 , 把名字都改过来 , 下面我用的是我的仓库名字

    $ git clone https://github.com/storm/

    strom.github.io.git .deploy/storm.github.io

    翻译下这条命令的意思

    将我们之前创建的GitHub 仓库克隆到本地 , 命令会新建一个目录叫做.deploy用于存放克隆的代码。

    然后会在.deploy文件夹下生成一个 你的名字.github.io 的文件夹用于存放文件

  2. 接着在 Hexo 根目录下创建一个 .txt 文件 , 把下面的命令复制进去

  3. 注意 :你的GitHub名字是什么就把你的名字全部改到下面 , 细心点(下面加粗的部分就是待修改的地方)

    hexo generate

    cp -R public/ .deploy/*jacman.github.io

    cd .deploy/jacman.github.io

    git add .

    git commit -m “update”

    git push origin master

  4. 将这个 .txt 文件的后缀改成 .sh , 它就变成了脚本文件 , 我们就将文件改成 deploy.sh 吧!意思就是部署

  5. 从此以后需要部署本地博客到 GitHub , 直接把脚本拖入到终端运行即可。

该部分需要注意的事项:

  1. 脚本拖入终端运行时一定要切换到 Hexo 目录下
  2. 运行如显示 Permission denied 说明没有权限,此时需要对脚本进行赋予权限的操作:在终端输入chmod 777,接着拖入脚本,再按回车,权限赋予成功后再把脚本拖入终端运行即可(运行脚本一定要切换到 Hexo目录下)。

7. 总结

搭建博客过程中会踩到许多坑,其中很多问题都是由于没有切换到 Hexo 目录下造成的。若能在终端上切换到正确的目录下进行操作,搭建博客的过程也会顺利不少。