首页 Hexo

# 导语

云影最近不知道什么原因，想把博客搞回来，之前的blog.iefar.cn使用的是emlog5.3.1版本，由于这个版本官方不再维护更新，我自己折腾的fys主题（破解版）又舍不得丢弃，所以一直不敢升emlog6.0。而且emlog5.3.1版本优化不是很好，可能是我搭载的插件过多，又或许是我用的是腾讯云的学生机，配置带不起来没办法，没钱啊 后来就百度，了解到了可以把纯静态的网页部署到github，那么我想起了一些纯静态的博客以前也想做，只是觉得麻烦 例如 Hugo、Hexo、Jekyll、Pelican等等，最终在逼乎的建议参考下，选择了Hexo。

# 安装git到Windows

目前云影只把项目放到windows环境，并从本地部署到git，MAC的后续可能会更新。

  1. 下载git到本地 https://git-scm.com/

  2. 打开安装包，并一路next即可 不懂的可以参考 windows系统Git安装详解

# 安装nodeJs

  1. 从官网上下载node.js安装包 http://nodejs.cn/download/
  2. 打开安装包，除了修改安装路径，其余的也是可以一路next即可 不懂的可以参考 Node.js入门一安装篇

# 安装Hexo

在确保git和node正常安装完成后，就可以搭建我们的主角——Hexo了

  1. 在本地新建一个文件夹

    新建文件夹

  2. 在这个文件夹里右键，点击Git Here

    git here

  3. 配置全局的git 信息，方便以后部署到github

    git config --global user.name "GitHub用户名"
    git config --global user.email "GitHub邮箱"

  4. 生成ssh密钥文件

    ssh-keygen -t rsa -C "Github邮箱”

  5. 前往github创建个人仓库 https://github.com/new

    1. 名字必须是username.github.io 这里的username指代的是你的git用户名

    2. 权限选择Public(公开)

    新建仓库完成后，可以到个人设置添加ssh keys

    添加sshKeys

    完了以后我们使用命令

    ssh git@github.com

    进行验证，验证结果如下

    验证结果

    只有出现这样的界面才算是成功

  6. 安装hexo到本地环境

    在你当前文件夹，打开git命令行并运行

    npm install -g hexo

    安装hexo，安装完成结果图

    安装hexo完成

    我们输入

    hexo

    查看hexo是否正确安装并且能够运行hexo命令

    检验hexo

    1. 开始初始化hexo博客工程

      hexo init

      初始化hexo

    2. 编译博客

      hexo g

      编译博客

    3. 启动本地服务器对博客进行预览

      hexo s

      启动并预览

      这时候我们可以在浏览器打开localhost:4000就可以访问我们的网站了

      预览图

    4. 常用的hexo命令

      # 部署到git平台或者其他平台
      hexo d
      # 清除缓存
      hexo clean
      # 升级hexo 
      npm update hexo -g
      # 合并使用 例如 清除缓存并编译然后部署到github
      hexo clean && hexo g && hexo d
      # 合并使用 例如 清除缓存并编译然后启动本地服务器
      hexo clean && hexo g && hexo s

      个人建议，没必要hexo clean的时候就不需要运行这个命令了，但是部署到git的话，建议还是先清除一下缓存

  7. 安装hexo主题并修改默认主题

    hexo的主题有很多很多，官方默认的主题是landscape ，主流的有：next、yilia、indigo等等

    # 这里以next主题为例
    git clone --branch v5.1.2 https://github.com/iissnan/hexo-theme-next themes/next

    由于主题一般都比较大，再加上github是国外的，可能克隆起来比较慢，耐心等待即可

    等待过程

    安装完成示例图

    安装主题完成

    修改配置文件，你博客根目录的_config.yml文件

    _config.yml

    把theme默认的landscape改成next

    theme: next

    next

    然后重新启动一下我们的本地服务器 建议先清除并编译

    如果报以下一样的错误

    报错

    这是因为hexo5.0把swig给删除了，需要手动安装一下

    npm i hexo-renderer-swig

    再次访问

    访问

    这样我们的主题就安装完成了 更多的内容请参考你使用的主题说明文档

  8. 部署到git

    在部署之前，我们需要安装hexo的部署插件

    npm install hexo-deployer-git --save

    修改网站的_config.yml

    部署1

    改成这样

    deploy:
      repository: git@github.com:efarxs/efarxs.github.io.git #刚才创建的github仓库的git地址 这里以我的作为示例，请务必改成你自己的
      type: git
      branch: master

    然后重新编译，并执行部署命令

    hexo d

    部署

    成功部署后，就可以登录github的项目路径查看该网站了

    http://你的用户名.github.io

  9. 安装hexo-admin 可以给可视化管理文章虽然我不用，哈哈

    npm install hexo-admin --save

    安装好后重新编译一下，并启动本地服务器，然后浏览器打开localhost:4000/admin就可以进入hexo-admin界面了

    在这里你可以编辑/发布文章，还可以存为草稿

    hexo-admin

    具体使用方法可以参考 https://github.com/jaredly/hexo-admin

  10. 配置github Pages绑定自己的域名到github

    打开你的项目，点击Settings->Options，下拉找到GitHub Pages配置

    默认只需要填写Custom domain的值就好，需要先把你的域名CNAME解析到username.github.io. 这里的username指代的是你的GitHub用户名

    然后就可以直接用你的域名访问了，不会的可以参考 GitHub Pages绑定个人域名

# 小结

​ 以上就是我在搭建hexo博客的全过程了，当然后续的配置修改和使用模板完全是根据个人习惯的，这里这是举个例子作为演示。如果你真的想更深入hexo，可以去hexo.io了解更多关于hexo的内容。感谢你的阅览！

更新于