·摘·使用hexo创建github博客
使用hexo创建github博客
http://oyjt.github.io/2016/01/14/%E4%BD%BF%E7%94%A8hexo%E5%88%9B%E5%BB%BAgithub%E5%8D%9A%E5%AE%A2/
发表于 2016-01-14 | 分类于 随笔 | 6条评论 | 阅读次数 1481
前面说过，之前用wordpress辛辛苦苦搭建的博客，因为服务器和域名的问题挂掉了。后来发现github也能够搭建自己的博客，不需要去关心主机域名的问题，而且还能使用Markdown来写博客，就研究了一番。
。。。。。。
使用hexo创建github博客
发表于 2016-01-14 | 分类于 随笔 | 7条评论 | 阅读次数
前面说过，之前用wordpress辛辛苦苦搭建的博客，因为服务器和域名的问题挂掉了。后来发现github也能够搭建自己的博客，不需要去关心主机域名的问题，而且还能使用Markdown来写博客，就研究了一番。
创建博客页面仓库
创建地址：https://github.com/new
创建仓库的前提是必须先有github账号，至于怎么注册账号，就不具体展开说明了。
创建的仓库名字需要和你的账号对应，如oyjt.github.io
输入基本信息，然后点击创建仓库
这里写图片描述
进入项目设置页面
现在仓库就已经建好了，接下来进入设置界面。
因为这个项目就是专门的放页面的,所以master分支即可。
这里写图片描述
进入页面自动生成器
在设置界面，点击运行自动页面生成器，其他默认即可。
这里写图片描述
写第一篇博客
点击之后，会跳到下面的页面，现在我们来写第一篇博客
这里写图片描述
写完之后点击继续，选择一个主题
这里写图片描述
选择主题并发布
这里提供了一些主题，可以一个个点击查看效果，找的喜欢的主题之后，就可以发布了。
选择主题之后，会生成一些css，html，img到你的仓库。
如果没有找到自己喜欢的主题，可以用其他的主题，当然也可以自己修改主题。
这里写图片描述
查看效果
现在，你就可以访问自己的github主页了。
比如我的博客访问地址：http://oyjt.github.io/
访问效果图：
这里写图片描述
到这里你会奇怪，说了这么多和hexo有什么关系，完全都没用到hexo，内容和标题完全不搭嘛。
是的！没错，为了便于管理博客，接下来就是hexo部分，请继续往下看吧！
了解Hexo
Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。
安装Hexo
安装 Hexo 相当简单。然而在安装前，您必须检查电脑中是否已安装下列应用程序：
Node.js
Git Windows
上面是以Windows系统作为例子，其他系统以及具体的安装方法，就不展开说明了。
如果您的电脑中已经安装上述必备程序，那么恭喜您！接下来只需要使用 npm 即可完成 Hexo 的安装。
1
2
3
4
npm install hexo-cli -g
如果命令无法运行，可以尝试更换taobao的npm源
npm install -g cnpm --registry=https://registry.npm.taobao.org
创建Hexo文件夹
安装 Hexo 完成后，请执行下列命令，Hexo 将会在指定文件夹中新建所需要的文件。
1
2
3
$ hexo init
$ cd
$ npm install
新建完成后，指定文件夹的目录如下：
1
2
3
4
5
6
7
8
.
├── _config.yml
├── package.json
├── scaffolds
├── source
| ├── _drafts
| └── _posts
└── themes
Hexo 文件简介
_config.yml
网站的 配置 信息，您可以在此配置大部分的参数。
package.json
应用程序的信息。EJS, Stylus 和 Markdown renderer 已默认安装，您可以自由移除。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
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 来建立文件。
source
资源文件夹是存放用户资源的地方。除 posts 文件夹之外，开头命名为 (下划线)的文件 / 文件夹和隐藏的文件将会被忽略。Markdown 和 HTML 文件会被解析并放到 public 文件夹，而其他文件会被拷贝过去。
themes
主题 文件夹。Hexo 会根据主题来生成静态页面。
本地查看效果
继续执行以下命令，成功后可登录localhost:4000查看效果
1
$ hexo server
Hexo常用简写命令
1
2
3
4
hexo n #生成文章，或者source\_posts手动编辑
hexo s #本地发布预览效果
hexo g #生成public静态文件
hexo d #部署之前预先生成静态文件
部署静态网页到GitHub
Hexo 提供了快速方便的一键部署功能，让您只需一条命令就能将网站部署到服务器上。
1
$ hexo deploy
在开始之前，您必须先在 _config.yml 中修改参数，一个正确的部署配置中至少要有 type 参数，例如：
1
2
deploy:
type: git
发布到git上需要安装 hexo-deployer-git 插件。
1
$ npm install hexo-deployer-git --save
修改配置。
1
2
3
4
5
deploy:
type: git
repo:
branch: [branch]
message: [message]
参数 描述
repo 库（Repository）地址
branch 分支名称。如果您使用的是 GitHub 或 GitCafe 的话，程序会尝试自动检测。
message 自定义提交信息 (默认为 Site updated: {{ now("YYYY-MM-DD HH:mm:ss") }})
配置完之后，运行命令 hexo d ，就能够将public里的文件发布到github。
现在就可以去查看网站的效果啦！
http://oyjt.github.io/
参考资料：
创建GitHub技术博客全攻略
Hexo官方文档
使用GitHub和Hexo搭建免费静态Blog
