博客搭建

前言

使用Hexo在GitHub上搭建个人博客

-

使用GitHub帐号创建仓库

生成秘钥,添加到Github中

1
ssh-keygen -t rsa -C "simple_sunc@163.com"

一路Enter过来就好,待秘钥生成完毕,会得到两个文件id_rsaid_rsa.pub,用带格式的记事本打开id_rsa.pub(或直接使用命令’cat xxx/id_rsa.pub文件’),Ctrl + A复制里面的所有内容,然后进入https://github.com/settings/ssh
将复制的内容粘贴到Key的输入框,随便写好Title里面的内容,点击Add SSH key按钮即可。

安装Node.js 官网

目前Node.js有两个推荐版本,分为通用版和最新版,点击可直接进行下载。下载好后,按照既定的套路安装即可。这里我使用的为通用版。

安装Git

这块就不再细说了,可以参考Git官网

安装配置Hexo

可选择进入官网自行查看

  • 我们需要将创建的仓库内容Clone到本地,这里我们使用终端命令
    cd xxx/xxx 切换到仓库代码将保存到的文件夹目录。
    使用git clone -b master git@github.com:joevess/joevess.io.git 克隆仓库到代码到本地。

  • 使用终端命令: cd xxx/xxx 切换到仓库代码根目录

  • 下载安装Hexo
    npm install -g hero-cli

  • 安装好Hexo之后,在终端输入:hexo ,若出现下图,则说明安装成功:

安装配置Hexo

1
2
3
4
5
6
// 初始化博客 <folder>为代码根目录
$ hexo init <folder>
// 进入博客文件夹
$ cd <folder>
// node.js的命令,根据博客既定的dependencies配置安装所有的依赖包
$ npm install

配置博客

在 Hexo 中有两份主要的配置文件,其名称都是_config.yml。 其中,一份位于站点根目录下,主要包含 Hexo 本身的配置;另一份位于主题目录下,这份配置由主题作者提供,主要用于配置主题相关的选项。

下面为我的站点根目录下_config.yml配置:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/
# Site
title: JoeVess's Blog
subtitle: the stack of it nerds
description: start from zero
author: JoeVess
language: zh-Hans
timezone: Asia/Shanghai
# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://joevess.github.io
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
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: false
tab_replace:
# Category & Tag
default_category: uncategorized
category_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-DD
time_format: HH:mm:ss
# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page
# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: next
# theme: notes
search:
path: search.xml
field: post
format: html
limit: 10000
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repo: https://github.com/joevess/joevess.github.io.git
branch: master

这里我使用的主题为Next,其详细配置可参考Next的官网(很详细)

0%