卑鄙的泡面

Hexo手记

之前经过Jekyll一系列踩坑部署了,想换个主题出各种问题,主要是最开始装环境出的错(改包路径到/usr/local/bin),导致有时候jekyll命令报错,就放弃了

以下都是基于OS X系统操作的

版本说明(时间为2017-1-3):

1
2
3
4
5
6
7
8
9
10
11
12
13
hexo_blog git:(master) ✗ hexo -v
hexo: 3.2.2
hexo-cli: 1.0.2
os: Darwin 16.3.0 darwin x64
http_parser: 2.5.2
node: 4.4.4
v8: 4.5.103.35
uv: 1.8.0
zlib: 1.2.8
ares: 1.10.1-DEV
icu: 56.1
modules: 46
openssl: 1.0.2h

安装Hexo

1
npm install -g hexo

本地创建博客

初始化

1
2
3
// 在目标文件夹下进行
hexo init
npm install

开启本地博客预览

1
2
3
4
5
// 构建站点文件
hexo g // 全拼是:hexo generate,可以简写成 hexo g
//启动本地服务器,默认地址为 localhost:4000
hexo s // 全拼是:hexo server,可以简写成 hexo s

发布到Coding(github)

之前的Jekyll是通过Git一步步手动上传的,这里的Hexo已经拥有’一键’部署组件,其安装如下:

1
npm install hexo-deployer-git --save

然后打开_config.ym文件进行编辑

1
2
3
4
5
6
//[github] => git@github.com:yourusername/youusername.github.io.git
//[coding] => git@git.coding.net:yourusername/yourusername.coding.me.git
deploy:
type: git
repo: //填写参考注释,如:git@git.coding.net:sinea17/sinea17.coding.me.git
branch: master

发布(这里只有hexo d,是因为前面已经执行了hexo g生产)

1
hexo d // 发布命令

更改博客主题

  1. 克隆/下载(Ps:克隆慢,可能断掉,建议下载)
  2. 配置_config.yml,theme值改为主题名
  3. 验证主题hexo s --debug(debug调试模式)

附:NexT主题配置说明

日常命令:

  • 创建普通文章

    1
    hexo new "文章标题"
  • 给文章添加标签和分类

    在文章(后缀.md)文件中加入tag和categor即可指定标签和分类。例子如下:

    1
    2
    3
    4
    5
    6
    7
    ---
    title: blog title
    date: 2016-07-20 10:59:31
    tag: 我是标签
    category: 我是分类
    description: #本页描述 可省略
    ---

    上面是单个标签或者分类,如果需要多个标签或分类可以两种写法(通用)

    1
    2
    3
    4
    5
    6
    7
    8
    9
    ---
    title: blog title
    date: 2016-07-20 10:59:31
    tag: [ 我是标签一, 我是标签二 ]
    category:
    - 我是分类一
    - 我是分类二
    description: #本页描述 可省略
    ---
  • 创建照片文章

    1. 修改\scaffolds\photo.md文件

      1
      2
      3
      4
      5
      6
      7
      layout: { { layout } }
      title: { { title } }
      date: { { date } }
      tags:
      photos:
      - <photo url>
      ---
    2. 新建照片文章

      1
      hexo new photo "photoPostName"

      hexo默认会处理全部 markdown 和 html 文件,如果不想让 hexo 解析,可以在文件头中加入 layout: false。

      1
      2
      3
      4
      5
      6
      7
      8
      ---
      layout: photo
      title: TestPhoto212
      photos:
      - http://bruce.u.qiniudn.com/2013/11/27/reading/photos-1.jpg
      date: 2017-01-04 13:44:34
      tags:
      ---
  • 文章摘要

    用于显示在首页的文章短描述

    1
    2
    //文章中插入以下代码即可,其上文字为摘要,在首页中就会出现“阅读更多”,点击则显示全文。
    <!--more-->
  • 删除文章

    1. 删除/source/_posts目录下的文章文件
    2. 重新生成站点静态网页,即:hexo g
  • 创建页面
    页面文件在博客根目录/source下对应名称文件夹下的index.md文件

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    //添加标签页
    hexo new page tags
    //添加分类页
    hexo new page categories
    //添加关于页
    hexo new page about
    //编辑关于页
    ---
    title: 关于
    date: 2017-01-04 11:31:06
    type: "about"
    comments: false
    ---
    姓名: 章凯
    所在地: 成都
    职业: WEB前端开发
    邮箱: sinea17@qq.com
  • 代码高亮
    需要在代码块第一个’点点点’后添加代码语言,但是测试后命令行bash没有效果,暂时不知道原因.写法如下:

    1
    ```css

    效果如下:

    1
    2
    3
    4
    5
    6
    body{
    color: red
    }
    .a:visited{
    color: blue
    }
  • 正常发布

    1
    2
    3
    hexo clean // clean本地项目,防止缓存
    hexo g // 生成静态网页
    hexo d // 发布
  • Hexo指令:点这里