准备工作
生成秘钥：
git config –global user.email “xxx@qq.com“ # 填写你github注册并且验证的邮箱
git config –global user.name “xxxx” # github 用户名
ssh-keygen # 会出现下面的内容，一直按Enter键就行
Generating public/private rsa key pair.
Enter file in which to save the key (/home/logan/.ssh/id_rsa):
/home/username/.ssh/id_rsa already exists.
Overwrite (y/n)? #因为我已经生成过了所以提示，一直回车即可
打开用户目录下的 .ssh 目录下面生成 id_rsa(私钥) id_rsa.pub(公钥)两个文件，
打开id_rsa.pub，复制里面的内容,到github
添加完之后
ssh -T git@github.com
输出 You’ve successfully authenticated 表示添加key 成功.
一、注册 github账号
https://github.com
二、建仓库
开启 github pages
- 4、再建一个仓库用于放文章、配置。 这个仓库名字随意，比如：blogSource
三、创建本地仓库
准备工作
- 1、找一个目录来作为你本地的仓库,比如我的是”D:\gitblog”,那么就在gitblog文件夹下初始化仓库，将第二步中创建的放网站的仓库clone到该文件夹中。
git clone xxx.git
四、安装hexo
node -v //查看版本
npm config set registry http://registry.cnpmjs.org/ # node 的源有很多，切换方式也很多，可以自行选择
npm install hexo -g #全局安装hexo,可能需要3分钟 出现warn警告信息不用管。
npm update hexo -g # 更新
因为Hexo 3.0 把服务器独立成了个别模块，您必须先安装才能使用。
npm install hexo-server –save #安装服务
npm install hexo-deployer-git –save
- 2、初始化 hexo , 我是在文件夹”D:\gitblog\hexo”下
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
|
> mkdir hexo #创建一个文件夹，初始化hexocd hexo
> hexo init # 初始化 hexo 文件夹 成功就会提示
当你看到Start blogging with Hexo! 恭喜！框架就已经搭建好了
执行以下命令就可以在本地起服务,进入hexo 目录下
> hexo server
然后访问[http://localhost:4000/](http://localhost:4000/)，就能看到自己博客的雏形了
hexo文件夹的作用
hexo/_config.yml #这个是hexo 配置文件
hexo/.deploy_git/ # 这个目录下面存放的是hexo 自带的git 配置
hexo/node_modules/ # hexo 需要的node js 模块
hexo/.npmignore # 文件里面存放的是npm需要忽略的文件
hexo/package.json # node.js 的配置文件
hexo/public/ # 存放要生成的静态网页
hexo/scaffolds/ # 生成文档的格式，用于 hexo new 命令 默认是post格式
hexo/source/ # 存放hexo new 生成的源文件，我们写的博客就是在这里
hexo/themes/ # hexo 的主题 都在这里面
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
1\. hexo new [layout] "file_name" # 新建 file_name 文章
# hexo new 文章名字 会创建个file_name.md 的文档
# 里面有一些默认的格式，文档的路径 hexo/source/_posts/
# layout 默认的是post 即scaffolds里面的的post文件
# 不写就是默认的，layout 可以自己配置
2\. hexo generate # 生成静态文档，将文章生成为博客的一部分，可简写为 hexo g
3\. hexo clean # 清理缓存文件 数据等（非必须），一般上传前线clean再generate
4\. hexo server //本地预览（非必须）， 可简写为 hexo s
5\. hexo deploy //推送到GitHub,可简写为 hexo d
|
- 4、hexo配置,配置文件 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
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
|
# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/
# Site
title: hiekay's blog #网站标题
subtitle: 分享技术的阳光地带 # 副标题
description: Recoding my grow of technology. # 介绍
author: hiekay # 作者
language: zh-CN # 语言
timezone: # 时区
# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: [https://hiekay.github.io/](https://hiekay.github.io/) # 填写github pages 生成的那个网址就ok
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 #将文件名转换为小写或大写，1.小写，2.大写，0.不转换
render_drafts: false # 渲染草稿
post_asset_folder: false # 开启Assert 文件夹
relative_link: false # 相对路径
future: true
highlight: # 代码高亮
enable: true #是否启动
line_number: true # 行号
auto_detect: false # 自动检测语言类型
tab_replace: # tab 键代替几个空格
# 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: maupassant # 这里配置主题直接写主题的名字就行
# Deployment 我们需要注意就就是这里
## Docs: https://hexo.io/docs/deployment.html
deploy:
- type: git
repo: git@github.com:hiekay/hiekay.github.io.git
# repo 很多人说不会填写，其实很简单，到你的开启github pages的仓库
# 页面，里面有一个 git clone 的git 地址，复制就可以了不会出错
# 最后注意是 git 类型的，不要复制 https 开头的
|
注意开始的url 和 最后的 deploy 选项，最后配置完成测试一下.
- 5、hexo 主题设置
**参考： https://www.haomwei.com/technology/maupassant-hexo.html **
打开链接：https://github.com/tufu9441/maupassant-hexo
1、点击右上角的Fork 按钮，然后你的github 仓库就会出现这个主题了
git clone 你自己的仓库的主题.git hexo/themes/maupassant (一定要是maupassant 文件夹，如果不是自己重命名)
cd D:\gitblog\hexo\themes
git clone xxx.git
** 路径要对，可以根据自己的情况，不过一定的是 themes 目录下的**
** maupassant 文件夹，这个文件夹肯定不存在，git 会自己创建的**
以后你对主题做的修改就不会丢失而且载搭建博客就会方便很多 ,修改完，记得 git push 就行.
2、保存
cd D:\gitblog\hexo
npm install hexo-renderer-jade –save
npm install hexo-renderer-sass –save
3、编辑Hexo目录下的 _config.yml，将theme的值改为maupassant
4、自己再启动看一下网站主题
5、部署到网上
保证上面都配置对了。
hexo clean
hexo g //hexo generate
hexo d // hexo deploy
现在就是见证奇迹的一刻，打开你的Git网址
成功了！最后执行:**(**hexo clean –>hexo generate –>hexo deploy)
你就可以看到你的博客了
记住，每次修改配置信息或者其他必须要执行上面的步骤，才可以使得配置信息生效。
- 1、新建新建一篇博客，在cmd执行命令：hexo new post “博客名”
hexo n “hai”
可以看到新建的文章
使用编辑器编好文章，那么就可以使用命令：hexo d -g，生成以及部署，该文章了。
到这也就完成了博客搭建，下面介绍的是进阶篇。
六、换成自己的域名
- 1、首先你需要自己购买好了一个域名。我是在阿里云上买的域名。然后在域名管理控制台，将域名解析与博客地址映射。
首先在本地 cmd 中 ping hiekay.github.io 得到ip。
然后在域名解析中配置好
- 2、Hexo目录下的source中建一个CNAME命名的文件夹(切记没有后缀)
内容写你的域名： www.hiekay.com
- 3、在github中配置域名,在setting 中配置自己的域名。
最后执行:**(**hexo clean –>hexo generate –>hexo deploy)
七、配置script，用本地Markdown 编辑器。
在Hexo中新建一篇博文非常简单，只需要在命令行中键入以下命令然后回车即可：
hexo new “The title of your blog”
此后Hexo便会在Hexo的根目录的source文件夹下的_posts目录下自动帮你创建相应的md文件。然后我们打开该目录，找到刚刚Hexo自动生成的文件打开编辑即可。
但是当我们的博文比较多，这样我们就需要在成堆的Markdown文件中找到刚才自动生成的文件，这样做显然是一件比较痛苦的事情。
hexo 提供相应的js 脚本，可以在hexo new 之后，使用你想用的应用打开 新建的文章。
首先在Hexo目录下的scripts目录中创建一个JavaScript脚本文件。
如果没有这个scripts目录，则新建一个。
scripts目录新建的JavaScript脚本文件可以任意取名，例如：new_open.js
通过这个脚本，我们用其来监听hexo new这个动作，并在检测到hexo new之后，执行编辑器打开的命令。
- 1、windows ,如果你是windows平台的Hexo用户，则将下列内容写入你的脚本：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
var spawn = require('child_process').exec;
// Hexo 2.x 用户复制这段
hexo.on('new',function(path){
spawn('start "markdown编辑器绝对路径.exe" '+ path);
});
// Hexo 3 用户复制这段
hexo.on('new',function(data){
spawn('start "markdown编辑器绝对路径.exe" '+ data.path);
});
|
eg:
1
2
3
4
5
6
7
8
9
10
11
|
var spawn = require('child_process').exec;
// Hexo 3 用户复制这段
hexo.on('new',function(data){
spawn('start "D://Program Files//Story//nw.exe" '+ data.path);
});
|
- 2、mac ,如果你是Mac平台Hexo用户，则将下列内容写入你的脚本：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
var exec =require('child_process').exec;
// Hexo 2.x 用户复制这段
hexo.on('new',function(path){
exec('open -a "markdown编辑器绝对路径.app" '+ path);
});
// Hexo 3 用户复制这段
hexo.on('new',function(data){
exec('open -a "markdown编辑器绝对路径.app" '+ data.path);
});
|
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
|
# 如果使用vi的这样写
# hexo 3.x 路径是[data.path] hexo
2.x 路径是 [path]
var editor = process.env.EDITOR || 'vi';
var child = require('child_process').spawn;
hexo.on('new', function(data){
child(editor, [data.path], {
stdio: 'inherit'});
});# 使用sublime var child = require('child_process').spawn;
hexo.on('new', function(data){
child(subl, [data.pat);
});
|
保存并退出脚本之后，在命令行中键入：
hexo new” auto open editor test”
是不是就顺利的自动打开了自动生成的md文件啦~
八、配置图床，博文中的图片
博主推荐七牛云 ，首页-七牛云 ，自行注册。
选择对象存储，内容管理,添加资源，然后你可以设置图片的格式，大小水印，这个按照步骤一个没有问题 。
图片的添加，通过–>更多操作–>内容管理 –>上传文件
图片外链就在图片操作选项里，直接复制到blog，片样式需要在图片外链后加上 “?图片样式”。
-1、qshell 命令行工具 ,
链接：[首页-七牛云qshell ](https://developer.qiniu.com/kodo/tools/1302/qshell）
[首页-七牛云qshell ](https://github.com/qiniu/qshell）
下载 qshell 工具之后，配置环境变量。
https://developer.qiniu.com/kodo/kb/1685/using-qshell-synchronize-directories
配置账户
qshell account AK SK
qshell account // 验证
在当前用户主目录中生成 qshell 目录：account.json //C:\Users\hiekay.qshell
使用qupload 命令同步本地图片到七牛云。
文档
配置config
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
# 这是我的 config 配置文件 upload.conf
{
"src_dir" : "D:\\gitblog\\qshell\\source", //本地同步路径，为全路径格式
"bucket" : "blog", //同步数据的目标空间名称
"key_prefix" : "blog", //在保存文件在七牛空间时，使用的文件名的前缀，默认为空字符串
"ignore_dir" : true, //保存文件在七牛空间时，使用的文件名是否忽略本地路径，默认为false
"check_exists" : true, //每个文件上传之前是否检查空间中是否存在同名文件
"overwrite" : true, //是否覆盖空间中已有的同名文件，默认不覆盖。
"rescan_local" : true //默认情况下，本地新增的文件不会被同步，需要手动设置为true才会去检测新增文件。
}
|
qshell qupload [并发数] [本地上传配置文件]
进入 .qshell 目录下
qshell qupload 3 upload.conf
进入七牛云查看
九、配置git source 保存文章。
这里就是使用git 管理博客的文章了
cd hexo
git init
-2、 编辑gitignore，忽略不想上传的文件 ,
在.gitignore 文件中添加以下内容
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
.DS_Store
Thumbs.dbdb.json*.lognode_modules
public.deploy*
debug.logindex.html.npmig*
themes
package.json
*~
|
git remote add origin 此处填写我们第一步建立的第二个仓库的git clone 的那个git地址
git remote add origin xxx.git
- 4、 添加文件夹,不会添加已经写在 .gitignore文件里面的文件
git add .
git commit-a-m”commit first”
git push origin master
注意：
在设置图标的时候一直没办法替换点原来的 后来发现 改名后的ico要放在所用主题的 source 下才行 而不是 根目录下的source（值得一提，解析24小时候 域名自带的logo才会消失