Hexo文档,管理自己的博客

hello world

Hexo

hexo是一款基于Node.js的静态博客框架。

特性

1、风一般的速度
Hexo基于Node.js,支持多进程,几百篇文章也可以秒生成。
2、流畅的撰写
支持GitHub Flavored Markdown和所有Octopress的插件。
3、扩展性
Hexo支持EJS、Swig和Stylus。通过插件支持Haml、Jade和Less.

安装

前提是必须先安装 Node.js。

npm install hexo -g

升级

更新hexo到最新版

npm update hexo -g

初始化

hexo init <folder>

如果指定 <folder>,便会在目前的资料夹建立一个名为 <folder> 的新资料夹;否则会在目前资料夹初始化。

创建新文章

hexo new [layout] <name>
hexo new "Hello World"
hexo new page "about"
hexo n page "about"

[layout]scaffolds 目录下的模版文件名。
如果不指定 [layout],默认生成的md文件放在 source/_post/ 目录下。

生成网站

hexo generate
hexo g

服务器

hexo server
hexo s

伺服器会跑在 http://localhost:port (port 预设为 4000,可在 _config.yml 设定。

部署

这里介绍下git部署

安装hexo-deployer-git

npm install hexo-deployer-git --save

修改_config.yml:

deploy:
  type: git
  repo: <repository url>
  branch: [branch]
  message: [message]

部署

hexo d --generate

默认目录结构

  • .deploy:执行hexo deploy命令部署到GitHub上的内容目录
  • public:执行hexo generate命令,输出的静态网页内容目录
  • scaffolds:layout模板文件目录,其中的md文件可以添加编辑
  • scripts:扩展脚本目录,这里可以自定义一些javascript脚本
  • source:文章源码目录,该目录下的markdown和html文件均会被hexo处理。该页面对应repo的根目录,404文件、favicon.ico文件,CNAME文件等都应该放这里,该目录下可新建页面目录。
    • _drafts:草稿文章
    • _posts:发布文章
  • themes:主题文件目录
  • _config.yml:全局配置文件,大多数的设置都在这里
  • package.json:应用程序数据,指明hexo的版本等信息,类似于一般软件中的关于按钮

站点配置文件 _config.yml 简单说明

# Hexo Configuration
## Docs: http://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site #整站的基本信息
title: SenPng的技术博客 #网站标题
subtitle: #网站副标题
description: 技术博客 #网站描述,给搜索引擎用的,在生成html中的head->meta中可看到
author: SenPng #网站作者,在下方显示
email: senpng@qq.com #联系邮箱
language: zh-Hans #语言
timezone:

# URL #域名
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://senpng.me #你的域名
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:

# Directory #文件结构
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:

# Writing #写文章选项
new_post_name: :title.md # File name of new posts
default_layout: post #默认layout方式
titlecase: false # Transform title into titlecase
external_link: true # Open external links in new tab
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight: #代码高亮
  enable: true #是否启用
  line_number: true #是否显示行号
  auto_detect: true
  tab_replace:

# Category & Tag #分类与标签
default_category: uncategorized
category_map:
tag_map:

# Server #本地服务参数
## Hexo uses Connect as a server
## You can customize the logger format as defined in
## http://www.senchalabs.org/connect/logger.html
port: 4000
logger: true
logger_format:

# Date / Time format #日期显示格式
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss

# Pagination #分页设置
## Set per_page to 0 to disable pagination
per_page: 10 #每页10篇文章
pagination_dir: page

# Extensions
## Plugins: http://hexo.io/plugins/
## Themes: http://hexo.io/themes/
theme: next # 主题

# Deployment #部署
## Docs: http://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: git@github.com:senpng/senpng.github.io.git
  branch: master
  message: Site updated:{.{ now("YYYY-MM-DD HH:mm:ss") }} #这里的 . 需要去掉

常见错误

{ [Error: Cannot find module './build/Release/DTraceProviderBindings'] code: 'MODULE_NOT_FOUND' }
{ [Error: Cannot find module './build/default/DTraceProviderBindings'] code: 'MODULE_NOT_FOUND' }
{ [Error: Cannot find module './build/Debug/DTraceProviderBindings'] code: 'MODULE_NOT_FOUND' }

解决方法:

npm install hexo --no-optional

主题 NexT

下载 NexT 主题

在终端窗口下,定位到 Hexo 站点目录下

cd your-hexo-site
git clone https://github.com/iissnan/hexo-theme-next themes/next

启用 NexT 主题

克隆/下载 完成后,打开 站点配置文件,找到 theme 字段,并将其值更改为 next

验证主题是否启用

运行 hexo s --debug,并访问 http://localhost:4000,确保站点正确运行。

主题设定

选择 Scheme

NexT 通过 Scheme 提供主题中的主题。 Mist 是 NexT 的第一款 Scheme。
启用 Mist 仅需在 主题配置文件 中将 #scheme: Mist 前面的 # 注释去掉即可。

语言设置

编辑 站点配置文件,将 language 设置成你所需要的语言。
例如选用正体中文,则配置为:

language: zh-hk

可用的语言如以下表格所示:

语言代码设定值
Englishenlanguage: en
简体中文zh-Hanslanguage: zh-Hans
Frenchfr-FRlanguage: fr-FR
正体中文zh-hk/zh-twlanguage: zh-hk
Russianrulanguage: ru
Germandelanguage: de

菜单设置

菜单配置在 主题配置文件menu。 若你的站点运行在子目录中,请将链接前缀的 / 去掉。默认支持的菜单项有:

键值设定值comment
homehome: /主页
archivesarchives: /archives归档页
categoriescategories: /categories分类页(需手动创建)
tagstags: /tags标签页(需手动创建)
aboutabout: /about关于页面 (需手动创建)
commonwealcommonweal: /404.html公益 404 (需手动创建)
菜单示例配置:
menu:
  home: /
  archives: /archives
  #about: /about
  #categories: /categories
  tags: /tags
  #commonweal: /404.html

侧栏设置

默认情况下,侧栏仅在文章页面(拥有目录列表)时才显示。可以通过修改 主题配置文件 中的 sidebar 字段来控制侧栏的行为。

支持的选项有:

  • post - 默认行为,在文章页面(拥有目录列表)时显示
  • always - 在所有页面中都显示
  • hide - 在所有页面中都隐藏(可以手动展开)

侧栏示例配置:

sidebar: post

头像设置

编辑 站点配置文件,新增字段 avatar, 值设置成头像的链接地址。

其中,头像的链接地址可以是:

地址 值
完整的互联网 URL https://avatars1.githubusercontent.com/u/32269?v=3&s=460
站点内的地址 /uploads/avatar.jpg - 需要将你的头像图片放置在 站点的 source/uploads/(可能需要新建 uploads 目录)
/images/avatar.jpg - 需要将你的头像图片放置在 主题的 source/images/ 目录下
头像设置示例:

avatar: https://avatars1.githubusercontent.com/u/32269?v=3&s=460

作者名称

编辑 站点配置文件,设置 author 为你的昵称。

站点描述设置

编辑 站点配置文件,设置 description字段为你的站点描述。站点描述可以是你喜欢的一句签名:)

主题配置文件 _config.yml 简单说明

# 菜单配置
menu:
  home: /
  archives: /archives
  # categories: /categories
  tags: /tags
  about: /about
  #commonweal: /404.html


# Enable/Disable menu icons.
# Icon Mapping:
#   Map a menu item to a specific FontAwesome icon name.
#   Key is the name of menu item and value is the name of FontAwsome icon.
#   When an question mask icon presenting up means that the item has no mapping icon.
menu_icons:
  enable: true
  # Icon Mapping.
  home: home
  about: user
  categories: th
  tags: tags
  archives: archive
  commonweal: heartbeat


# Mist
# 使用 Mist 主题
#scheme: Mist

# Sidebar 侧栏行为,可选值有
#  - post   默认值,在文章页面自动展开侧栏
#  - always 在所有页面自动展开侧栏
#  - hide   在手动点击侧栏的开关按钮时展开
#  - remove 
#sidebar: post
#sidebar: always
sidebar: hide
#sidebar: remove

# Social Icons
social_icons:
  enable: true
  # Icon Mappings
  GitHub: github
  Twitter: twitter
  Weibo: weibo


# Sidebar Avatar #头像
avatar: /images/avatar.png


# Social links #友情链接
social:
  GitHub: https://github.com/senpng


# TOC in the Sidebar
toc:
  enable: true

  # Automatically add list number to toc.
  number: true


# 代码高亮主题
# available: normal | night | night eighties | night blue | night bright
highlight_theme: normal

# `阅读全文` 按钮跳转之后是否自动滚动页面到设置 `<!-- more -->` 的地方。
scroll_to_more: true

# 自动形成摘要
auto_excerpt:
  enable: true
  length: 150

  默认截取的长度为 150 字符,可以根据需要自行设定

# Use Lato font
use_font_lato: true

# MathJax support
# 开启数学公式渲染支持,默认关闭。设置为 `true` 开启。
mathjax: true


#! ---------------------------------------------------------------
#! DO NOT EDIT THE FOLLOWING SETTINGS
#! UNLESS YOU KNOW WHAT YOU ARE DOING
#! ---------------------------------------------------------------

# Motion
use_motion: true

# Fancybox
fancybox: true

# Static files
vendors: vendors
css: css
js: js
images: images

# Theme version
version: 0.4.5.2

此文章为原作,转载请注明出处:
http://kseven.me/2016/Hexo-file/

千 里 送 é 毛 | The Next Sentence...