开发工具

从零开始用Hexo+Github搭建博客

Github, hexo

昨晚用有道云笔记写Markdown文档的时候，发现Markdown不能插入本地图片，师姐说可以在七牛申请一个服务器，然而又发现申请服务器需要一个域名，于是又去请教师姐，然后师姐说我们可以用GitHub免费搭建一个博客，不需要购买，这两天你们在学习GitHub和Git的操作，那明天的任务就把博客搭出来吧，用Hexo和GitHub……

写在前面

  • 本教程主要是收集和总结了用Hexo和Github搭建博客过程中所参考的资料，踩过的坑，以及一些注意的事项，并没有详细的写出每一次操作。
  • 主要参考教程
  1. 手把手教你用Hexo+GitHub搭建属于自己的博客
  2. 使用hexo+github搭建免费个人博客详细教程
  3. 在Github上面搭建Hexo博客（一）：部署到Github

基本过程

  1. 搭建环境（Node.js和git的安装和配置,GitHub账号设置）
  2. 安装Hexo和配置Hexo
  3. 将Hexo与GitHub page关联起来
  4. 选择主题
  5. 主题设置
  6. 编写Markdown

1. 搭建环境

1.1 Node.js的安装和配置

  • Node.js安装配置
  • 安装过程中除了修改安装路径外，其他的保持默认设置即可。
  • 安装完成后，检查一下是否安装成功，同时按下Win和R键，打开运行窗口，输入cmd，回车打开命令行界面，输入
1
2
node -v
npm -v

如果出现node和npm的版本号，则表示安装成功了

  • 之前失败过一次，后来卸载了重装就成功了哈哈

    1.2 Git的安装和配置

  • Git安装
  • Git教程

    1.3 GitHub账号设置

  1. 申请GitHub账号
  2. 创建GitHub仓库（这个仓库和平时的GitHub仓库不同，命名的格式是gourname.github.io，如我的github的全名为xiaoxiongzi，那仓库的命名就为xiaoxiongzi.github.io）
  • ==重点难点：将本地仓库和远程仓库关联起来==

2. 安装Hexo和配置Hexo

  1. 初始Hexo

    1
    hexo init

  2. 安装npm组件

1
npm install
  1. 体验Hexo
1
hexo g
1
hexo s

出现相关提示，在浏览器中打开就可以了。

3. 将Hexo与GitHub page 联系起来

1. 配置Deployment，将本地的文件部署（上传）到Github账户中

  • 编辑本地Hexo目录下文件_comfig.yml，在最后添加如下代码（在你修改时，把 xiaoxiongzi要替换成你自己的用户名）
1
2
3
4
deploy:
    type: git
    repository: http://github.com/xiaoxiongzi/xiaoxiongzi.github.io.git
    branch: master
  • .yml文件对格式规范要求很严格，type: repository: branch: 前面有两个空格，冒号后面都有一个空格。
  • 执行以下指令即可完成部署（如果提示错误，可以看下面注意）：
    1
    2
    $ hexo generate
    $ hexo deploy

2.配置SSH

4. 使用Hexo写博客

分享到