hexo+github搭建个人博客

一直想出一份教程, 但是总要自己研究透彻了来给大家分享。现在勉强算是能稍微理解了所以来给大家讲解一下。

总共分为五个部分。

  1. 安装git
  2. 安装node.js
  3. 安装hexo。
  4. 上传github
  5. 更换主题

一. 安装git

mac系统时自带git的, 可直接使用以下命令进行查看git版本
$ git --version

windows系统, 直接访问msysGit

安装完成之后, 需要进行如下配置, 此为全局配置

$ git config --global user.name "your name"
$ git config --global user.email "your email"

二. 安装node.js

直接去官网下载安装, node.js

三. 安装hexo, 参考hexo官网

打开终端, 新建文件夹, 我这边新建了 myblog, 然后 cd 进入, 此处可能会慢点, 需要自己挂代理.

$ npm install -g hexo-cli

执行init

$ hexo init

安装依赖包

$ npm install

此时我们的环境已经搭建好了, 执行以下命令在浏览打开localhost:4000 可直接查看

$ hexo g
$ hexo s

四. 上传github

刚刚所有的操作都是在本地执行的,  我们并没有能够在网络上看到。
  1. 在github上新建一个仓库, 仓库的名称格式为 yourgithubname.github.io, 比如我叫amoslv, 所以我新建amoslv.github.io. 配置ssh建立连接我这里就不详细列举了。
  2. 创建好仓库之后, cd进入我们刚刚hexo init的文件夹, 找到根目录下的_config.yml.
    在最下方, deploy一栏配置下面的数据
# You can use this:
deploy:
  type: git
  repo: <repository url>
  message: [message]
  name: [git user]
  email: [git email] 

安装将生成的hexo文件部署到github的插件。(注意这个很重要, 因为这个插件会重新生成上传的文件, 直接使用git push上传没有作用)

$ npm install hexo-deployer-git --save

五. 更改hexo的主题

更改本地查看的时候会发现默认的主题很丑, 我这边建议是使用next 主题。
参考 next主题 https://github.com/theme-next/hexo-theme-next

依次执行:
进入自己本地blog根目录, 比如我的/Users/amoslv/Desktop/myblog/blog

$ cd /Users/amoslv/Desktop/myblog/blog

将next主题clone下来

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

后续如果next主题需要更新的话, 可直接

$ cd themes/next
$ git pull

启用该主题, 在根目录下的_config.yml

theme: next (注意冒号后面有空格!!!)

六. 新建文章并上传到github

现在我们已经将准备工作都做得差不多了, 现在来完整的发一篇文章试试

  1. 新建文庄
$ hexo new "My New Post"
  1. 生成文章前先clean一下, 基本每次部署前都需要这样操作一次
$ hexo clean
  1. 生成文章
$ hexo generate
  1. 本地运行查看
$ hexo server

5.部署到github

$ hexo deploy

当然以上都可以简写为

$ hexo clean
$ hexo g
$ hexo s
$ hexo d

好了, 一篇完整的教程就下来了, 尽情的折腾吧。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值