| HEXO

HEXO搭建

轻量级的Hexo为静态页面的制作提供了很好的发挥空间，风格扁平舒适。

用hexo搭建网站省时省力，建议使用成熟的next主题(本站不是)，不然会耗费较多时间。

安装git
安装node.js(hexo依赖)
安装hexo

初始化

1
$ hexo init  //生成hexo目录

需要在空文件夹中生成。

目录结构

1
2
3
4
5
6
7
8
.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

配置文件_config.yml有两个，一个为hexo，另一个为themes下的配置。

选择主题

官网样例很多，最好选自带有评论功能的，不然后面加很麻烦。

手动添加评论功能：Valine

1.分清目录

主题目录结构

2.手动添加代码

​ 根据Valine手册，先在head.ejs里加载valine

1
<script src='//unpkg.com/valine/dist/Valine.min.js'></script>

​ 然后在_partial目录下找到post.ejs，在里面找到内容尾部，加上评论模块，没有就加一个comments.ejs

1
2
3
<div class="col-md-8 col-md-offset-2 col-sm-24">
    <%- partial('post/comments') %> <!--这里的comments就是comments.ejs-->
</div>

​ comments.ejs里就是配置项了

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<% if (theme.valine.enable) { %>
<div id="vcomments"></div>

<script type="text/javascript">
    new Valine({
        // 请使用你自己的设置
        el: '#vcomments',
        appId: '<%- theme.valine.appId %>',
        appKey: '<%- theme.valine.appKey %>',
        path: '<%- theme.valine.path %>',
        //notify:false,
        //verify:false,
        avatar:'<%- theme.valine.avatar %>',
        placeholder: '<%- theme.valine.placeholder %>',
        //meta: '<%- theme.valine.meta %>',
        visitor: '<%- theme.valine.visitor %>',
        recordIP: '<%- theme.valine.recordIP %>',
        pageSize: 10,
        lang: '<%- theme.valine.lang %>',
        //requiredFields: '<%- theme.valine.requiredFields %>',
        serverURLs: '<%- theme.valine.serverURLs %>',
        });
</script>
<% } %>

3.配置项

最后在_config.yml里加上配置就大功告成，valine好用不依赖，但是就是要实名这点不好。

1
2
3
4
5
6
7
8
9
10
11
12
13
valine:
  enable: true
  appId: #appId
  appKey: #appKey
  notify: false
  verify: false
  placeholder: Just go go
  avatar: monsterid
  guest_info: nick,mail,link
  pageSize: 10
  visitor: false
  recordIP: true
  serverURLs: #serverURLS

生成本地预览

1
$ hexo d && hexo g && hexo s //开启预览访问端口 默认4000

主题文件在themes下，默认为landscape。你可以在hexo.io中找到喜欢的主题。

线上部署

1
2
$ npm install hexo-deployer-git --save  //安装部署插件
$ hexo cl && hexo g && hexo d

本地效果完成后，可以进行Github Pages的部署（当然还有其他选择）。在hexo中的_config.yml中设置deploy参数(配置项冒号后要有空格)。配置有两种方式：http或者ssh。

关于自定义域名：域名解析类型为CNAME；根目录source文件夹下创建CNAME.txt，写入自定义域名，保存后去掉文件后缀


ESC