简介
对于想拥有快速、简洁、高效的博客且没有广告的个人博客系统,Hexo是一个不错的选择。以下是Hexo的几个特性:
- 可以使用Markdown语法编写博客;
- 基于Node.js把源文件(.md等)编译成静态项目(.html、.css、.js等);
- 可以一键部署到GitHub Pages, Heroku 或其他平台;
- 支持插件集成和丰富的插件生态;
本文将带领大家从零开始搭建属于自己的博客系统,并做一些简单的配置。
后续会介绍博客的美化、功能的丰富、博客的运维等。
安装
安装Node环境
- Mac安装Node。 不知道brew是什么?如果你是一名软件开发人员,强烈推荐安装brew。
1
brew install node
- Linux安装Node
1
yum install -y nodejs
- 其它系统
其它系统安装Node.js可以去Node.js官网下载安装包安装。
安装完Node.js后会自动安装npm。
使用npm安装Hexo
npm install -g hexo-cli
创建博客项目
hexo init blog
如果找不到hexo,可以使用npx
,如:npx hexo init blog
。
安装依赖
1 | cd blog |
启动项目
1 | npx hexo server 或 npx hexo s |
到此,使用Hexo搭建的博客系统就已经安装成功了。
可通过浏览器输入http://localhost:4000
访问博客系统。
配置
修改站点配置文件
,站点配置文件
是根目录的_config.yml
。
站点信息
1 | # -- 站点信息 |
文章永久链接
文章链接默认的生成规则是::year/:month/:day/:title,是按照年、月、日、标题来生成的,文章标题修改后,链接会变。
我们使用abbrlink为文章自动生成唯一链接,即使文章标题或者内容修改后,链接也不会变。
- 安装依赖
1
npm install hexo-abbrlink --save
- 修改配置:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17# -- 永久链接
#ipermalink: :year/:month/:day/:title/
#permalink_defaults:
#pretty_urls:
# trailing_index: true # Set to false to remove trailing 'index.html' from permalinks
# trailing_html: true # Set to false to remove trailing '.html' from permalinks
permalink: posts/:abbrlink/
abbrlink:
alg: crc32 #support crc16(default) and crc32
rep: hex #support dec(default) and hex
drafts: false #(true)Process draft,(false)Do not process draft
# Generate categories from directory-tree
# depth: the max_depth of directory-tree you want to generate, should > 0
auto_category:
enable: true
depth:
在线编辑博客
以下二选一,本博客使用方式二:
在线编辑博客,图片存在博客里
- 安装依赖
1
npm install hexo-admin --save
- 重启Hexo
- 浏览器在线编辑博客
通过地址http://localhost:4000/admin
即可在线编辑博客。 - 设置在线编辑博客的用户密码:
1
2
3
4
5# -- 在线编辑博客
admin:
username: test
password_hash: $2a$10$UEayfM4LTXOKcjATBIQksuLooRDxzedxqPcvGuyIr47VJ/wA8Fk7m
secret: test - 重启Hexo再次通过浏览器在线编辑博客
访问地址http://localhost:4000/admin
,输入用户名/密码:test/password
即可在线编辑博客。
在线编辑博客,图片存在七牛云
图片可以博客放在一起,但是如果自己的服务器带宽低的话,加载图片会比较慢,这时候我们可以把图片放到七牛云的CDN,七牛云每月免费10G空间,作为简单的个人博客这些流量足够我们使用。
图片上传到七牛,需要上七牛云注册申请对象存储,还需要拥有自己的域名。
该插件是基于在线编辑博客实现的,所有配置和在线编辑博客配置一样,只是需要添加七牛账号的相关配置。
- 安装依赖
1
npm install hexo-admin-qiniu --save
- 添加配置:
1
2
3
4
5
6
7
8
9
10
11# -- 在线编辑博客,并把图片上传到七牛
admin:
username: test
password_hash: $2a$10$UEayfM4LTXOKcjATBIQksuLooRDxzedxqPcvGuyIr47VJ/wA8Fk7m
secret: test
qiniuCfg:
imageslim: true # 启动图片瘦身,仅华东区bucket可以使用
AccessKey: '***'
SecretKey: '***'
BucketName: 'duanjw-blog'
bucketHost: 'cdn.duanjw.com'