发布于 

Stellar建站之路

  

初探GitHubPage+hexo搭建博客

前言

在搭建博客的时候，难免会遇到些小细节会搞不清楚，网上查资料繁琐又有些过时，遂写下这篇文章记录下，供日后参考。 为什么我选择了hexo搭建，而不是wordpress。 一方面，我喜欢比较简洁博客，不需要太多花里胡哨的。 其次，搭建wordpress需要服务器，而使用 hexo 来搭建只需要利用好 Github 就可以搞定。白嫖永远的神

搭建流程

首先，利用hexo+github建站需要什么?注册好GitHub账号，会简单使用Git Bash，了解过markdown语法和yaml语法，善于利用搜索引擎。以及不怕折腾的精神

安装

  1. 安装git bash
    Git Bash官网

  2. 安装node.js
    淘宝镜像站

    版本要求

    Hexo 版本 Node.js 版本
    5.0+ 最低10.13.0

  3. 安装hexo
    使用npm安装hexo-cli

  4. 执行 Hexo：

    1. npx hexo <command>
    2. 添加环境变量
      将 Hexo 所在的目录下的 node_modules 添加到环境变量之中即可使用 hexo <command>

详细的github+hexo建站流程，网上也有很多，我在这就不赘述了。在这里贴下KChen大佬写的教程，写得十分详细，从基础搭建，到博客配置部署，以及Travis Cl持续集成。遇到有所疑惑的，也可到HEXO官网文档解惑。

配置主题

hexo的主题我目前使用的是stellar

安装主题
  1. 在git bash上运行以下代码
  1. 修改blog/_config.yml文件中theme

当然也可以使用其他主题，在主题文档有较为详细的说明。

  • Front-matter 页面头元素
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    --- 文章模板
    title: {{ title }}
    date: {{ time }}
    categories: [xx,xx]
    tags: 
    comments: true
    lang: zh-CN
    ---

    &emsp;&emsp;
     
    <!--more-->

域名解析记录怎么填写

解析记录

顾名思义，是提供DNS（域名服务器）的一些规则，你按要求填写服务器才知道要怎么解析你的域名。

A记录：IPV4解析 也就是你目标地址是192.168.1.1这样4组10进制的数。

域名NAME TYPE TLL Target
www.example.com A 3600 192.168.1.1

  • AAAA记录： IPV6解析 和IPV4一样的含义，区别在于目的地址变成了 

           ABCD:EF01:2345:6789:ABCD:EF01:2345:6789的形式。

  • CNAME记录：别名记录 和Liunx的alias差不多，由域名A跳转到域名B，域名B提供ip地址。

  • NS记录： 域名服务器记录 把域名解析交给其他域名服务商解析

  • MX记录：如果需要设置邮箱，让邮箱能收到邮件，就需要添加MX记录。

关于通配符，有些域名服务商支持，有些不支持，就不展开来说了。

例如:我在freenom上DNS管理面板的配置
I3ayss.jpg由于这个网址的域名管理只能填完整域名，不能使用通配符，所以只能将这样www.exampe.com的网址填入NAME栏。

解决md文件与hexo标签冲突

在md文件里学习写hexo标签时，用到了多个hexo标签嵌套，使用hexo generate生成 ，突然发现报错。

1
Template render error:

原因

网上一查才发现原来是markdown语法与hexo标签冲突了：
md文件就按md形式解析,从而导致了无法正确渲染hexo标签

解决方法

  1. 修改md文件内容
    使用以下代码将冲突段嵌套在里面
    `

    使用hexo generate`后，倒是正常通过，但是hexo标签并没生效

  2. 修改nunjucks模块代码
    找到模块地址，修改相应js文件

    1
    node_modules/nunjucks/src/lexer.js

    找到以下代码

    1
    2
    var VARIABLE_START = '{{';
    var VARIABLE_END = '}}';

    修改代码为

    1
    2
    var VARIABLE_START = '{$';
    var VARIABLE_END = '$}';

    但是修改后还是报错，遂作罢（bushi）

  3. 加一点小细节 （最终解决方法）
    之后，我突然想到去已经建好stallar主题博客的GitHub仓库康康，将我写的md文件和他的一观察，才发现只是缺失一点小细节：在hexo标签中必须要有内容，而且一般md语法与hexo标签要用换行将它们区分开

    1
    2
    3
    4
    5
    6
    {% tabs %}
    <!-- tab a -->
    内容
    <!-- tab b -->
    内容
    {% endtabs %}
许可协议

本文采用 署名-非商业性使用-相同方式共享 4.0 国际 许可协议，转载请注明出处。

分享文章