Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。
安装步骤
安装前提
安装 Hexo 相当简单。然而在安装前,您必须检查电脑中是否已安装下列应用程序:
如果您的电脑中已经安装上述必备程序,那么恭喜您!接下来只需要使用 npm 即可完成 Hexo 的安装。
1 | $ npm install -g hexo-cli |
如果您的电脑中尚未安装所需要的程序,请根据以下安装指示完成安装。
Mac 用户
您在编译时可能会遇到问题,请先到 App Store 安装 Xcode,Xcode 完成后,启动并进入 Preferences -> Download -> Command Line Tools -> Install 安装命令行工具。
安装 Git
- Windows:下载并安装 git.
- Mac:使用 Homebrew, MacPorts :
brew install git
;或下载 安装程序 安装。 - Linux (Ubuntu, Debian):
sudo apt-get install git-core
- Linux (Fedora, Red Hat, CentOS):
sudo yum install git-core
Windows 用户
由于众所周知的原因,从上面的链接下载git for windows最好挂上一个代理,否则下载速度十分缓慢。也可以参考这个页面,收录了存储于百度云的下载地址。
安装 Node.js
安装 Node.js 的最佳方式是使用 nvm。
CURL:
1 | $ curl https://raw.github.com/creationix/nvm/v0.33.11/install.sh | sh |
Wget:
1 | $ wget -qO- https://raw.github.com/creationix/nvm/v0.33.11/install.sh | sh |
安装完成后,重启终端并执行下列命令即可安装 Node.js。
1 | $ nvm install stable |
或者您也可以下载 安装程序 来安装。
Windows 用户
对于windows用户来说,建议使用安装程序进行安装。安装时,请勾选Add to PATH选项。
另外,您也可以使用Git Bash,这是git for windows自带的一组程序,提供了Linux风格的shell,在该环境下,您可以直接用上面提到的命令来安装Node.js。打开它的方法很简单,在任意位置单击右键,选择“Git Bash Here”即可。由于Hexo的很多操作都涉及到命令行,您可以考虑始终使用Git Bash来进行操作。
安装 Hexo
所有必备的应用程序安装完成后,即可使用 npm 安装 Hexo。
1 | Copy $ npm install -g hexo-cli |
建站
建站操作明细
搭建一个名字为blog的博客:
1 | hexo init blogcd blognpm install |
建站文件结构讲解
安装 Hexo 完成后,请执行下列命令,Hexo 将会在指定文件夹中新建所需要的文件。
1 | $ hexo init <folder>$ cd <folder>$ npm install |
新建完成后,指定文件夹的目录如下:
1 | .├── _config.yml├── package.json├── scaffolds├── source| ├── _drafts| └── _posts└── themes |
_config.yml
网站的 配置 信息,您可以在此配置大部分的参数。
package.json
应用程序的信息。EJS, Stylus 和 Markdown renderer 已默认安装,您可以自由移除。
1 | package.json{ "name": "hexo-site", "version": "0.0.0", "private": true, "hexo": { "version": "" }, "dependencies": { "hexo": "^3.0.0", "hexo-generator-archive": "^0.1.0", "hexo-generator-category": "^0.1.0", "hexo-generator-index": "^0.1.0", "hexo-generator-tag": "^0.1.0", "hexo-renderer-ejs": "^0.1.0", "hexo-renderer-stylus": "^0.2.0", "hexo-renderer-marked": "^0.2.4", "hexo-server": "^0.1.2" }} |
scaffolds
模版 文件夹。当您新建文章时,Hexo 会根据 scaffold 来建立文件。
Hexo的模板是指在新建的markdown文件中默认填充的内容。例如,如果您修改scaffold/post.md中的Front-matter内容,那么每次新建一篇文章时都会包含这个修改。
source
资源文件夹是存放用户资源的地方。除 _posts
文件夹之外,开头命名为 _
(下划线)的文件 / 文件夹和隐藏的文件将会被忽略。Markdown 和 HTML 文件会被解析并放到 public
文件夹,而其他文件会被拷贝过去。
themes
主题 文件夹。Hexo 会根据主题来生成静态页面。
配置
您可以在 _config.yml
中修改大部份的配置。
配置操作明细
配置文件中主要修改了博客的语言、标题、作者、描述、时区和文件模式post_asset_folder
。
1 | # Hexo Configuration## Docs: https://hexo.io/docs/configuration.html## Source: https://github.com/hexojs/hexo/# Sitetitle: Booboo Wei's Blogsubtitle: Talk is cheap, show me the codedescription: 数据库工程师keywords: MySQL Linux DBA BigData Redis Pythonauthor: Booboo Weilanguage: zh-Hanstimezone: UTC# URL## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'url: http://yoursite.comroot: /permalink: :year/:month/:day/:title/permalink_defaults:# Directorysource_dir: sourcepublic_dir: publictag_dir: tagsarchive_dir: archivescategory_dir: categoriescode_dir: downloads/codei18n_dir: :langskip_render:# Writingnew_post_name: :title.md # File name of new postsdefault_layout: posttitlecase: false # Transform title into titlecaseexternal_link: true # Open external links in new tabfilename_case: 0render_drafts: falsepost_asset_folder: truerelative_link: falsefuture: truehighlight: enable: true line_number: true auto_detect: false tab_replace:# Home page setting# path: Root path for your blogs index page. (default = '')# per_page: Posts displayed per page. (0 = disable pagination)# order_by: Posts order. (Order by date descending by default)index_generator: path: '' per_page: 10 order_by: -date# Category & Tagdefault_category: MySQLcategory_map:tag_map:# 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-DDtime_format: HH:mm:ss# Pagination## Set per_page to 0 to disable paginationper_page: 10pagination_dir: page# Extensions## Plugins: https://hexo.io/plugins/## Themes: https://hexo.io/themes/theme: landscape# Deployment## Docs: https://hexo.io/docs/deployment.htmldeploy: type: |
配置参数讲解
网站
参数 | 描述 |
---|---|
title |
网站标题 |
subtitle |
网站副标题 |
description |
网站描述 |
author |
您的名字 |
language |
网站使用的语言 |
timezone |
网站时区。Hexo 默认使用您电脑的时区。时区列表。比如说:America/New_York , Japan , 和 UTC 。 |
其中,description
主要用于SEO,告诉搜索引擎一个关于您站点的简单描述,通常建议在其中包含您网站的关键词。author
参数用于主题显示文章的作者。
网址
参数 | 描述 | 默认值 |
---|---|---|
url |
网址 | |
root |
网站根目录 | |
permalink |
文章的 永久链接 格式 | :year/:month/:day/:title/ |
permalink_defaults |
永久链接中各部分的默认值 |
网站存放在子目录
如果您的网站存放在子目录中,例如
http://yoursite.com/blog
,则请将您的url
设为http://yoursite.com/blog
并把root
设为/blog/
。
目录
参数 | 描述 | 默认值 |
---|---|---|
source_dir |
资源文件夹,这个文件夹用来存放内容。 | source |
public_dir |
公共文件夹,这个文件夹用于存放生成的站点文件。 | public |
tag_dir |
标签文件夹 | tags |
archive_dir |
归档文件夹 | archives |
category_dir |
分类文件夹 | categories |
code_dir |
Include code 文件夹 | downloads/code |
i18n_dir |
国际化(i18n)文件夹 | :lang |
skip_render |
跳过指定文件的渲染,您可使用 glob 表达式来匹配路径。 |
提示
如果您刚刚开始接触Hexo,通常没有必要修改这一部分的值。
文章
参数 | 描述 | 默认值 |
---|---|---|
new_post_name |
新文章的文件名称 | :title.md |
default_layout |
预设布局 | post |
auto_spacing |
在中文和英文之间加入空格 | false |
titlecase |
把标题转换为 title case | false |
external_link |
在新标签中打开链接 | true |
filename_case |
把文件名称转换为 (1) 小写或 (2) 大写 | 0 |
render_drafts |
显示草稿 | false |
post_asset_folder |
启动 Asset 文件夹 | false |
relative_link |
把链接改为与根目录的相对位址 | false |
future |
显示未来的文章 | true |
highlight |
代码块的设置 |
相对地址
默认情况下,Hexo生成的超链接都是绝对地址。例如,如果您的网站域名为
example.com
,您有一篇文章名为hello
,那么绝对链接可能像这样:http://example.com/hello.html
,它是绝对于域名的。相对链接像这样:/hello.html
,也就是说,无论用什么域名访问该站点,都没有关系,这在进行反向代理时可能用到。通常情况下,建议使用绝对地址。
分类 & 标签
参数 | 描述 | 默认值 |
---|---|---|
default_category |
默认分类 | uncategorized |
category_map |
分类别名 | |
tag_map |
标签别名 |
日期 / 时间格式
Hexo 使用 Moment.js 来解析和显示时间。
参数 | 描述 | 默认值 |
---|---|---|
date_format |
日期格式 | YYYY-MM-DD |
time_format |
时间格式 | H:mm:ss |
分页
参数 | 描述 | 默认值 |
---|---|---|
per_page |
每页显示的文章量 (0 = 关闭分页功能) | 10 |
pagination_dir |
分页目录 | page |
扩展
参数 | 描述 |
---|---|
theme |
当前主题名称。值为false 时禁用主题 |
deploy |
部署部分的设置 |
指令
指令操作明细
在上一步基本配置后,我们可以在本地启动我们的博客网站了。具体操作如下:
打开git bash,执行
1 | hexo new "我的第一篇文章" |
该命令会在blog/source/_post/目录中创建一个文件和一个同名的目录:
- 文件:
我的第一篇文章.md
- 目录:
我的第一篇文章
目录用于存放图片,这样将来在网页中才能通过markdown的语法调用图片。
1 | $ hexo new '我的第一篇文章'INFO Created: ~\Desktop\jigouyun_Git\个人项目\doc-share\source\_posts\我的第一篇文章.mdrgwei@DESKTOP-G9S0U3G MINGW64 ~/Desktop/jigouyun_Git/个人项目/doc-share/source/_posts$ ll 我的*-rw-r--r-- 1 rgwei 197121 69 11月 27 10:20 我的第一篇文章.md我的第一篇文章:total 0 |
接下来就可以通过markdown的编辑器编辑你的文章。
指令讲解
init
1 | $ hexo init [folder] |
新建一个网站。如果没有设置 folder
,Hexo 默认在目前的文件夹建立网站。
new
1 | $ hexo new [layout] <title> |
新建一篇文章。如果没有设置 layout
的话,默认使用 _config.yml 中的 default_layout
参数代替。如果标题包含空格的话,请使用引号括起来。
generate
1 | $ hexo generate |
生成静态文件。
选项 | 描述 |
---|---|
-d , --deploy |
文件生成后立即部署网站 |
-w , --watch |
监视文件变动 |
该命令可以简写为
1 | $ hexo g |
publish
1 | $ hexo publish [layout] <filename> |
发表草稿。
server
1 | $ hexo server |
启动服务器。默认情况下,访问网址为: http://localhost:4000/
。
选项 | 描述 |
---|---|
-p , --port |
重设端口 |
-s , --static |
只使用静态文件 |
-l , --log |
启动日记记录,使用覆盖记录格式 |
deploy
1 | $ hexo deploy |
部署网站。
参数 | 描述 |
---|---|
-g , --generate |
部署之前预先生成静态文件 |
该命令可以简写为:
1 | $ hexo d |
render
1 | $ hexo render <file1> [file2] ... |
渲染文件。
参数 | 描述 |
---|---|
-o , --output |
设置输出路径 |
migrate
1 | $ hexo migrate <type> |
从其他博客系统 迁移内容。
clean
1 | $ hexo clean |
清除缓存文件 (db.json
) 和已生成的静态文件 (public
)。
在某些情况(尤其是更换主题后),如果发现您对站点的更改无论如何也不生效,您可能需要运行该命令。
list
1 | $ hexo list <type> |
列出网站资料。
version
1 | $ hexo version |
显示 Hexo 版本。
选项
安全模式
1 | $ hexo --safe |
在安全模式下,不会载入插件和脚本。当您在安装新插件遭遇问题时,可以尝试以安全模式重新执行。
调试模式
1 | $ hexo --debug |
在终端中显示调试信息并记录到 debug.log
。当您碰到问题时,可以尝试用调试模式重新执行一次,并 提交调试信息到 GitHub。
简洁模式
1 | $ hexo --silent |
隐藏终端信息。
自定义配置文件的路径
1 | $ hexo --config custom.yml |
自定义配置文件的路径,执行后将不再使用 _config.yml
。
显示草稿
1 | $ hexo --draft |
显示 source/_drafts
文件夹中的草稿文章。
自定义 CWD
1 | $ hexo --cwd /path/to/cwd |
自定义当前工作目录(Current working directory)的路径。
写作
Front-matter
稍微与markdown不同的是,我们必须在文章的开头加一些标识,才能够做到给文章分类和打标签的功能。
首先新建一个文章hexo new "CPU飙高故障排查"
然后我们修改CPU飙高故障排查.md
的文章如下:
1 | ---title: CPU飙高故障排查date: 2018-01-17 14:11:01categories:- AIA友邦tags:- 云数据库 RDS MySQL 版- 数据库CPU故障---## 故障描述2018-01-16 21点左右 `prod-mysql01`数据实例的CPU100% , 阿里的监控图也没有显示了,后台阿里建议做主从切换,切换后数据库慢慢的恢复了, 现在需要找出故障原因。## 排查过程从监控图中可以看到,CPU飙高的事件段为:`2018-01-16 21:00:00 `左右 |
文章的头部叫做”Front-matter“以 ---
分隔的区域
1 | ---title: CPU飙高故障排查date: 2018-01-17 14:11:01categories:- AIA友邦tags:- 云数据库 RDS MySQL 版- 数据库CPU故障--- |
- categories:建议只由一个
- tags:可以由多个
生成html页面
使用 Hexo 生成静态文件快速而且简单。
1 | $ hexo generate或者$ hexo g |
因为我们是本地部署,因此不用执行后续的动作。
启动本地服务
Hexo 3.0 把服务器独立成了个别模块,您必须先安装 hexo-server 才能使用。
1 | $ npm install hexo-server --save |
安装完成后,输入以下命令以启动服务器,您的网站会在 http://localhost:4000
下启动。在服务器启动期间,Hexo 会监视文件变动并自动更新,您无须重启服务器。
1 | $ hexo server |
如果您想要更改端口,或是在执行时遇到了 EADDRINUSE
错误,可以在执行时使用 -p
选项指定其他端口,如下:
1 | $ hexo server -p 5000 |
静态模式
在静态模式下,服务器只处理 public
文件夹内的文件,而不会处理文件变动,在执行时,您应该先自行执行 hexo generate
,此模式通常用于生产环境(production mode)下。
1 | $ hexo server -s |
自定义 IP
服务器默认运行在 0.0.0.0
,您可以覆盖默认的 IP 设置,如下:
1 | $ hexo server -i 192.168.1.1 |
指定这个参数后,您就只能通过该IP才能访问站点。例如,对于一台使用无线网络的笔记本电脑,除了指向本机的127.0.0.1
外,通常还有一个192.168.*.*
的局域网IP,如果像上面那样使用-i
参数,就不能用127.0.0.1
来访问站点了。对于有公网IP的主机,如果您指定一个局域网IP作为-i
参数的值,那么就无法通过公网来访问站点。
Pow
Pow 是一个 Mac 系统上的零配置 Rack 服务器,它也可以作为一个简单易用的静态文件服务器来使用。
安装
1 | $ curl get.pow.cx | sh |
设置
在 ~/.pow
文件夹建立链接(symlink)。
1 | $ cd ~/.pow$ ln -s /path/to/myapp |
您的网站将会在 http://myapp.dev
下运行,网址根据链接名称而定。
部署在Github
如果需要部署在github上面,请参见使用Hexo+Github一步步搭建属于自己的博客(基础)
修改博客模板为Next
如果需要修改博客模板为Next,请参见hexo搭建个人博客–NexT主题优化